android studio Activity標題欄研究

第一次研究時間：2016/7/30,以下研究主要存在於當前最新版本的android studio上。eclipse請參考

一、頭部標題取消

當前版本新建工程在 application中默認主題為 android:theme="@style/AppTheme" ，存在於res/values/styles.xml中代碼，此為默認創建時不同版本可能不一樣

<!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

取消標題方式：

1、全部取消主題，android:theme=""輸入@style/No查詢，這邊出現以下三個，選哪個都可以就是樣式不同，等做的時候不行再換

android:theme="@style/Theme.AppCompat.DayNight.NoActionBar"
android:theme="@style/Theme.AppCompat.Light.NoActionBar"
android:theme="@style/Theme.AppCompat.NoActionBar"

2、單個取消主題，就是在<activity 便簽中同樣存在android:theme=""，里面的值同上

　  在代碼中取消標題,在android studio中使用，eclipse看下方代碼:

//請將以下代碼寫在 setContentView() 前面
supportRequestWindowFeature(Window.FEATURE_NO_TITLE);

    也可以自己寫style進行引用

<style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
      
</style>

     在eclipse中使用這個

requestWindowFeature(Window.FEATURE_NO_TITLE);

　　附帶取消頭部狀態欄代碼，狀態欄為最上面的小黑條，顯示着時間，電量什么的，手指按住可以下拉,eclipse下同

//同樣寫在setContentView()之上
this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN);

而網上使用以下標簽來同時消除標題跟狀態欄只有在文件 extends Activity時是有用的，在繼承AppCompatActivity或者ActionBarActivity閃退，最近試了一下最新的版本使用上述方法取消狀態欄可行(2017.1.13),不行的話請看原因請看鏈接

http://www.eoeandroid.com/thread-559545-1-1.html?_dsign=51bbc2e6

android:theme="@android:style/Theme.NoTitleBar.Fullscreen"

 

二、標題欄設計

1.標題欄樣式設計看圖說話:http://blog.sina.com.cn/s/blog_6e334dc70102ve7d.html

首先我們只要知道對應的顏色就可以啦：

colorPrimary：標題欄背景色

colorPrimaryDark：狀態欄的背景色

textColorPrimary：標題欄上的文字，圖標等的背景色，對圖actionbar有用，但是現在我們用toolbar代替actionbar，暫時無用

colorAccent：各控制元件(如：check box、switch 或是 radoi) 被勾選 (checked) 或是選定 (selected) 的顏色。

colorControlNormal：各控制元件的預設顏色。各個空間觸發就是上面的顏色

windowBackground：App 的背景色。

navigationBarColor：導航欄的背景色，但只能用在 API Level 21 (Android 5) 以上的版本

2.toolbar樣式設計：參考 http://www.jianshu.com/p/91eabe0c326d

這邊補充點為：android默認就兩種風格，白底黑字帶有light的還有就是黑底白字。app:popupTheme表示為點擊三點彈出的框框的樣式，app:theme 表示當前view的樣式

這邊測試的完整代碼：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/main_toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.AppBarOverlay"
        app:theme="@style/MyCustomToolBarStyle">

        <TextView
            android:id="@+id/toolbar_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:textSize="18sp"/>

    </android.support.v7.widget.Toolbar>


</LinearLayout>

　　styles.xml

<resources>

    <!-- 整個APP的樣式 -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item><!--原色，標題欄底部背景顏色-->
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item> <!--色彩突顯，如checkView以及EditText和其他控件的按鈕樣式顏色-->
        <item name="android:textColorPrimary">@android:color/holo_green_dark</item><!--title 或者默認返回按鈕 或者三點 這類的顏色-->
    </style>
    <!--mainActivity的樣式-->
    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>

    </style>
    <!--點擊三點彈出框的樣式-->
    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" >
    </style>
    <!--標題欄的字體樣式-->
    <style name="MyCustomToolBarStyle" parent="ThemeOverlay.AppCompat.Light">
        <item name="android:textColorPrimary">@color/textColorPrimary</item><!--用來定義標題欄文字顏色,setTitle時使用，自定義的toolbar中的textView不起效果-->
        <item name="android:textColorSecondary">@color/textColorSecondary</item><!--用來定義彈出菜單icon的顏色(豎着排列的那三個點顏色，以及返回按鈕等)-->
        <item name="android:textColor">@color/colorAccent</item><!--用來定義彈出菜單OptionMenu文字的顏色，自定義的toolbar中的textView有效果-->
    </style>

</resources>

　　MainActivity.java

package com.one.minyuchun.startone;

import android.content.Context;
import android.content.Intent;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;

import android.widget.TextView;
import android.widget.Toast;

import com.one.minyuchun.startone.utils.Util;

import org.w3c.dom.Text;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{


    private TextView titleTxt;

    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initTitleOne();

    }

    private void initTitleOne() {
        toolbar=(Toolbar) findViewById(R.id.main_toolbar);
        setSupportActionBar(toolbar);
        setTitle("你好啊",true);
        setBack();
    }

    /**
     * 顯示圖標與是否在中間顯示
     * @param title   標題
     * @param isCenter  是否中間顯示
     */
    public void setTitle(String title,boolean isCenter){
        titleTxt = (TextView)findViewById(R.id.toolbar_title);
        if(isCenter){
            titleTxt.setText(title);
        }else{
            setTitle(title);
        }

        toolbar.setLogo(R.mipmap.ic_launcher);
    }

    public void setBack(){
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);//給左上角圖標的左邊加上一個返回的圖標
        getSupportActionBar().setDisplayShowHomeEnabled(true);////使左上角圖標是否顯示，如果設成false，則沒有程序圖標，僅僅就個標題，否則，顯示應用程序圖標
        getSupportActionBar().setHomeButtonEnabled(true);//這個小於4.0版本的默認值為true的。但是在4.0及其以上是false，該方法的作用：決定左上角的圖標是否可以點擊。沒有向左的小圖標
        getSupportActionBar().setDisplayShowTitleEnabled(true);
    }

    @Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        getMenuInflater().inflate(R.menu.search,menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case R.id.search:
                Toast.makeText(this,"search",Toast.LENGTH_SHORT).show();
                break;
        }
        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()){
        }
    }
}

代碼不難，看着參考資料以及代碼應該可以全通。

1、其他修改：修改右邊三點的樣式：可在activity的theme模式中中進行修改，如上述activity使用AppTheme.NoActionBar，添加其中提條item，變為如下：

<!--mainActivity的樣式-->
    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:src">@android:drawable/ic_menu_call</item>
    </style>

三點變成刪除圖標，但是點擊效果相同。

2、其他修改：修改點擊右邊三點彈出的選擇框樣式，顯示是不僅顯示文字同時顯示圖標,在MainActivity.java 中重寫自帶的方法如下:

/***
     * 將三點內的muen展現圖標和文字
     * @param view
     * @param menu
     * @return
     */
    @Override
    protected boolean onPrepareOptionsPanel(View view, Menu menu) {
        if (menu != null) {
            if (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);
    }

3、其他修改：點擊左上角顯示的默認返回按鈕或者toolbar.setNavigationIcon()設置的圖表時，獲取點擊事件需要重寫自帶的onOptionsItemSelected方法，代碼如下:

@Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()){
            case android.R.id.home:
                onBackPressed();
                break;
        }
        return super.onOptionsItemSelected(item);
    }
//onBackPressed()；方法也是自帶的方法，默認為執行finish()，可重寫，這邊添加此方法使得點擊導航欄的返回按鈕與點擊標題欄返回按鈕執行效果一致。

4、其他修改：點擊左上角返回按鈕使得關閉當前activity並且跳轉到指定的activity，修改AndroidManifest.xml在其activity標簽下添加屬性android:parentActivityName="activity包名"，並在mainActivity.java中設置setDisplayHomeAsUpEnabled(true)代碼如下：

<activity  
        android:name="com.example.myfirstapp.DisplayMessageActivity"  
        android:label="@string/title_activity_display_message"  
        android:parentActivityName="com.example.myfirstapp.MainActivity" >  
        <!-- Parent activity meta-data to support 4.0 and lower -->  
        <meta-data  
            android:name="android.support.PARENT_ACTIVITY"  
            android:value="com.example.myfirstapp.MainActivity" />  
    </activity>  
//添加<meta-data  以便適應4.0一下版本

@Override  
public void onCreate(Bundle savedInstanceState) {  
    ...  
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);  
}

5、其他修改：menu不管怎么設置不出現，menu只存在於overflow(右邊三點中)，不顯示問題,將menu中的代碼修改如下:

<?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
        app:showAsAction="always"
        android:id="@+id/user_p"
        android:icon="@android:drawable/ic_menu_add"
        android:title="用戶"/>
    <item
        android:id="@+id/write_p"
        android:icon="@android:drawable/ic_menu_delete"
        app:showAsAction="always"
        android:title="發布"/>
    <item
        android:id="@+id/favo_p"
        android:icon="@android:drawable/ic_menu_more"
        app:showAsAction="always"
        android:title="收藏"/>
</menu>
//所有的showAsAction都用app:前綴替換android:前綴，添加xmlns:app引用，如果還不能出現請查看所有theme設置

6、其他修改：使用app:actionViewClass="android.widget.SearchView"做出標題欄點擊放大鏡按鈕出現搜索欄，代碼如下

<?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/search"
        android:title="search"
        android:icon="@android:drawable/ic_search_category_default"
        app:showAsAction="collapseActionView|ifRoom"
        app:actionViewClass="android.support.v7.widget.SearchView"> 
　　</item> 
</menu> 
//注意使用app:actionViewClass代替android:actionViewClass,使用android.support.v7.widget.SearchView代替android.widget.SearchView

代碼中獲取SearchView的字數變化方法，重寫onCreatePanelMenu中的方法，代碼如下：

@Override
    public boolean onCreatePanelMenu(int featureId, Menu menu) {
        Log.i(TAG,"onCreatePanelMenu");
        getMenuInflater().inflate(R.menu.search,menu);

        MenuItem searchItem=menu.findItem(R.id.toolbar_search);
        if(searchItem!=null){
            final SearchView searchView=(SearchView)searchItem.getActionView();
            searchView.setOnQueryTextListener(new SearchView.OnQueryTextListener() {
                //點擊確認搜索按鈕是執行
                @Override
                public boolean onQueryTextSubmit(String query) {
                    Log.i(TAG,"query "+query);
                    if( ! searchView.isIconified()) {
                        searchView.setIconified(true);
                    }
                    return false;
                }
                //動態檢測文字變化之行
                @Override
                public boolean onQueryTextChange(String newText) {
                    Log.i(TAG,"newText "+newText);
                    return false;
                }
            });
            //點擊后面的x按鈕
            searchView.setOnCloseListener(new SearchView.OnCloseListener() {
                @Override
                public boolean onClose() {
                    return false;
                }
            });
        }
        return true;
    }

　

3.toolbar其他的設置

getSupportActionBar().setDisplayHomeAsUpEnabled(true);//給左上角圖標的左邊加上一個返回的圖標，與toolbar的setNavigationIcon效果相同，同時設置時此覆蓋

getSupportActionBar().setDisplayShowHomeEnabled(true);//用來控制是否顯示toolbar的Logo或者actionbar的icon,這兩個其實為相同設置

getSupportActionBar().setHomeButtonEnabled(true);//小於4.0版本的默認為true，在4.0以上是false，作用：決定左上角的圖標是否可以點擊。沒有向左的小圖標，目前測試無效果 
getSupportActionBar().setDisplayShowTitleEnabled(true);//是否顯示默認的title標題，包括subtitle,

getSupportActionBar().setIcon(R.mipmap.ic_launcher);//設置圖標，與toolbar的logo效果相同，同時設置時，此設置覆蓋


toolbar.setNavigationIcon(android.R.drawable.ic_menu_delete);//給左上角圖標的左邊加上一個返回的圖標，與actionbar的setDisplayHomeAsUpEnabled效果相同，同時設置時此被覆蓋

toolbar.setLogo(R.mipmap.ic_launcher);//設置圖標，與actionbar的setIcon效果相同，同時設置時，此設置被覆蓋

toolbar.setTitle("");//設置toolbar默認標題。使其有效需要將該設置寫在setSupportActionBar(toolbar)；之前

　　

 

 

參考其他優秀文章：http://blog.csdn.net/c12366456/article/details/51534816

http://blog.csdn.net/guolin_blog/article/details/18234477

http://www.cnblogs.com/yc-755909659/p/4290784.html

最新的toolbar使用效果參考：http://www.jianshu.com/p/1078568e859f