高仿微信APP實戰（一）-Actionbar的制作與應用

本文是仿微信app實戰系列的第一部分，先從簡單的做起，邊做邊學習。從頂部actionbar開始，先看一下效果圖：

一、定義主題樣式

<resources><style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"><item name="colorPrimary">@color/colorPrimary</item><item name="colorPrimaryDark">@color/colorPrimaryDark</item><item name="colorAccent">@color/colorAccent</item><item name="android:textColorPrimary">@color/white</item><item name="android:itemTextAppearance">@style/WeChatActionBarOverflow</item> <item name="actionOverflowMenuStyle">@style/weixinOverflowMenuStyle</item></style><style name="weixinOverflowMenuStyle"><item name="android:popupBackground">@color/colorPrimary</item></style> <style name="WeChatActionBarOverflow" parent="@android:style/Widget.ActionButton.Overflow"> <item name="android:textColor">@color/white</item> </style> </resources>

這里解釋一下這些屬性的含義，在我的APP Theme中定
義了一些顏色，這里用一幅圖進行講解：

這里自定義了一個actionOverflowMenuStyle，由于主題中默認的popupmenu item的背景色為白色，設置po’pupBackground屬性將item的背景色設為Actionbar的顏色。注意這里的style不要繼承Widget.AppCompat.PopupMenu.Overflow，因為默認情況下或者繼承這個style后，popupmenu會遮擋actionbar。

接著設置itemTextAppearance屬性，將item字體顏色改成白色。

二、定義menu

在res/menu文件夾下創建menu_main.xml

<?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"><item android:id="@+id/action_search"android:actionViewClass="android.widget.SearchView"android:icon="@drawable/actionbar_search_icon"app:showAsAction="always"android:title="@string/action_search"/><item android:id="@+id/action_overflow"android:icon="@drawable/actionbar_add_icon"android:title="overflow"app:showAsAction="always"><menu><item android:id="@+id/action_group_chat"android:icon="@drawable/menu_group_chat_icon"android:title="@string/menu_group_chat"/><item android:id="@+id/action_add_friend"android:icon="@drawable/menu_add_icon"android:title="@string/menu_addfriend"/><item android:id="@+id/action_scan"android:icon="@drawable/men_scan_icon"android:title="@string/menu_scan"/><item android:id="@+id/action_money"android:icon="@drawable/menu_card_icon"android:title="@string/menu_money"/><item android:id="@+id/action_feedback"android:icon="@drawable/menu_feedback_icon"android:tile="@string/menu_feedback"/></menu></item></menu>

這里使用雙層menu嵌套實現，這樣做有兩個好處。一個是可以自定義overflowButton，就是微信右上角的加號，而不是使用默認的三個點的圖標。第二個是點擊系統自帶的overflowButton彈出的menu不會顯示配置的icon圖標，網上很多仿微信actionBar使用反射來解決，即在onPrepareOptionsPanel用反射設置setOptionalIconsVisible為true，完全沒有必要。

//完全沒必要@Overrideprotected boolean onPrepareOptionsPanel(View view, Menu menu) {if (menu != null && menu.getClass() == MenuBuilder.class){try {Method m = menu.getClass().getDeclaredMethod("setOptionalIconsVisible", Boolean.TYPE);m.setAccessible(true);m.invoke(menu,true);}catch (Exception e){e.printStackTrace();}}return super.onPrepareOptionsPanel(view, menu);}

三、Activity中的邏輯

public class MainActivity extends AppCompatActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.menu_main, menu);return super.onCreateOptionsMenu(menu);}}

這里邏輯比較簡單不做解釋了。到此微信Actionbar的基本樣子就已經實現，后續會繼續添加功能。

總結

以上是生活随笔為你收集整理的高仿微信APP实战（一）-Actionbar的制作与应用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。