android studio Activity標題欄研究

時間 2019-11-12

標籤 android studio activity 標題欄研究欄目 Android 简体版

原文原文鏈接

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

1、頭部標題取消java

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

<!-- 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>

取消標題方式：app

一、所有取消主題，android:theme=""輸入@style/No查詢，這邊出現如下三個，選哪一個均可以就是樣式不一樣，等作的時候不行再換dom

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

View Code

二、單個取消主題，就是在<activity 便籤中一樣存在android:theme=""，裏面的值同上eclipse

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

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

View Code

也能夠本身寫style進行引用測試

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

在eclipse中使用這個字體

requestWindowFeature(Window.FEATURE_NO_TITLE);

View Code

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

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

View Code

而網上使用如下標籤來同時消除標題跟狀態欄只有在文件 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"

View Code

2、標題欄設計

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()){
        }
    }
}

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

一、其餘修改：修改右邊三點的樣式：可在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>

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

二、其餘修改：修改點擊右邊三點彈出的選擇框樣式，顯示是不只顯示文字同時顯示圖標,在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);
    }

三、其餘修改：點擊左上角顯示的默認返回按鈕或者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()，可重寫，這邊添加此方法使得點擊導航欄的返回按鈕與點擊標題欄返回按鈕執行效果一致。

四、其餘修改：點擊左上角返回按鈕使得關閉當前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);  
}

五、其餘修改：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設置

六、其餘修改：使用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