Adnroid Toolbar 自定義Toolbar佈局

默認調用系統的toolbar,分以下幾個步驟:

  1. 在佈局文件中添加toolbar
  2. 描述toolbar中menu的佈局
  3. 在代碼中調用

主佈局文件:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white">

    <android.support.v7.widget.Toolbar
        android:layout_height="?attr/actionBarSize"
        android:layout_width="match_parent"
        android:id="@+id/id_tool_bar"
        android:background="?attr/colorPrimary"

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

</RelativeLayout>

menu佈局:(android:orderInCategory表示的是展示的優先級)

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".MainActivity">

    <item
        android:id="@+id/action_edit"
        android:orderInCategory="80"
        android:title="edit"
        android:icon="@drawable/ab_edit"
        app:showAsAction="ifRoom" />
    <item
        android:id="@+id/action_share"
        android:orderInCategory="90"
        android:title="share"
        android:icon="@drawable/ab_share"
        app:showAsAction="ifRoom" />

    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="hh"
        app:showAsAction="never" />
</menu>

在代碼中調用:

package com.example.guo.test_toolbar;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar)findViewById(R.id.id_toolbar);

        // App Logo
        //toolbar.setLogo(R.mipmap.ic_launcher);
        //toolbar.setTitle("HHH");
        // Sub Title
       // toolbar.setSubtitle("hhh");
        setSupportActionBar(toolbar);

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {

        getMenuInflater().inflate(R.menu.menu, menu);
        return true;
    }
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() == android.R.id.action_share){
            finish();
            return true ;
        }
        return super.onOptionsItemSelected(item);
}

以上代碼運行結果如下所示:

自定義toolbar佈局:

  1. 在佈局文件中加入自己要定義的佈局
  2. 在代碼中設置

在佈局文件中加入自定義的佈局:

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

    android:layout_height="match_parent"
    tools:context=".MainActivity">


    <android.support.v7.widget.Toolbar
        android:id="@+id/id_toolbar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="?attr/colorPrimary"
        android:fitsSystemWindows="true"
        app:navigationIcon="@mipmap/ic_launcher"
        app:title=" ">

        <TextView
            android:id="@+id/toolbar_num"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_marginLeft="16dp"
            android:text="num"
            android:textColor="#BFBFBF"
            android:textSize="16dp" />
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@drawable/ab_edit"/>
        <TextView
            android:id="@+id/toolbar__"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_marginLeft="16dp"
            android:text="num"
            android:textColor="#BFBFBF"
            android:textSize="16dp" />

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

</RelativeLayout>

在代碼中調用:

package com.example.guo.test_toolbar;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar)findViewById(R.id.id_toolbar);
        setSupportActionBar(toolbar);
        ImageView mImage=(ImageView)findViewById(R.id.mimage);
        mImage.setOnClickListener(new View.OnClickListener() {
            @Override
                public void onClick(View v) {                              
                    Toast.makeText(MainActivity.this,"hello",Toast.LENGTH_LONG).show();
            }
        });
    }
}

以上代碼運行如下所示:
這裏寫圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章