在Android工具栏中创build一个button

如何在Android的Toolbar创build一个button,看起来像这个iOS例子?

iOS示例

工具栏与button教程

1 – 在build.gradle添加库兼容性

 dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:21.0.3' } 

2 – 创build一个文件名color.xml来定义Toolbar颜色

 <?xml version="1.0" encoding="utf-8"?> <resources> <color name="ColorPrimary">#FF5722</color> <color name="ColorPrimaryDark">#E64A19</color> </resources> 

3 – 修改你的style.xml文件

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

4 – 创build一个类似于tool_bar.xml的xml文件

 <?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/ColorPrimary" android:elevation="4dp" > </android.support.v7.widget.Toolbar> 

5 – 将Toolbarmain_activity.xml

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <include android:id="@+id/tool_bar" layout="@layout/tool_bar" ></include> <TextView android:layout_below="@+id/tool_bar" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="@dimen/TextDimTop" android:text="@string/hello_world" /> </RelativeLayout> 

6 – 然后把它放在你的MainActivity类中

 package com.example.hp1.materialtoolbar; import android.support.v4.widget.DrawerLayout; import android.support.v7.app.ActionBarActivity; import android.os.Bundle; import android.support.v7.app.ActionBarDrawerToggle; import android.support.v7.widget.LinearLayoutManager; import android.support.v7.widget.RecyclerView; import android.support.v7.widget.Toolbar; import android.view.Menu; import android.view.MenuItem; import android.view.MotionEvent; import android.view.View; import android.widget.Toast; public class MainActivity extends ActionBarActivity { /* When using Appcombat support library you need to extend Main Activity to ActionBarActivity. */ private Toolbar toolbar; // Declaring the Toolbar Object @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main_activity); toolbar = (Toolbar) findViewById(R.id.tool_bar); // Attaching the layout to the toolbar object setSupportActionBar(toolbar); // Setting toolbar as the ActionBar with setSupportActionBar() call } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { // Handle action bar item clicks here. The action bar will // automatically handle clicks on the Home/Up button, so long // as you specify a parent activity in AndroidManifest.xml. int id = item.getItemId(); //noinspection SimplifiableIfStatement if (id == R.id.action_settings) { return true; } return super.onOptionsItemSelected(item); } } 

7 – 最后,将“Button Items”添加到/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" xmlns:tools="http://schemas.android.com/tools" tools:context=".MainActivity"> <item android:id="@+id/action_settings" android:orderInCategory="100" android:title="@string/action_settings" app:showAsAction="never" /> <item android:id="@+id/action_search" android:orderInCategory="200" android:title="Search" android:icon="@drawable/ic_search" app:showAsAction="ifRoom" ></item> <item android:id="@+id/action_user" android:orderInCategory="300" android:title="User" android:icon="@drawable/ic_user" app:showAsAction="ifRoom"></item> </menu> 

工具栏自定义可以通过以下方式完成

在工具栏里面写下button和textViews代码,如下所示

 <android.support.v7.widget.Toolbar xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/app_bar" android:layout_width="match_parent" android:layout_height="wrap_content" > <Button android:layout_width="wrap_content" android:layout_height="@dimen/btn_height_small" android:text="Departure" android:layout_gravity="right" /> </android.support.v7.widget.Toolbar> 

其他方法是使用如下所示的项目菜单

 @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. getMenuInflater().inflate(R.menu.menu_main, menu); return true; } 

它们被称为工具栏/操作栏中的菜单项或操作button。 在这里,你有谷歌教程如何工作,以及如何添加它们https://developer.android.com/training/basics/actionbar/adding-buttons.html

我在ToolBar中添加了文本:

menu_skip.xml

  <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_settings" android:title="@string/text_skip" app:showAsAction="never" /> </menu> @Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = getMenuInflater(); inflater.inflate(R.menu.menu_otp_skip, menu); return true; } @Override public boolean onOptionsItemSelected(MenuItem item) { switch (item.getItemId()) { // action with ID action_refresh was selected case R.id.menu_item_skip: Toast.makeText(this, "Skip selected", Toast.LENGTH_SHORT) .show(); break; default: break; } return true; } 

另一种可能性是在菜单中设置app:actionViewClass属性

 <menu xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto>"> <item android:id="@+id/get_item" android:orderInCategory="1" android:text="Get" app:showAsAction="always" app:actionViewClass="android.support.v7.widget.AppCompatButton"/> </menu> 

在你的代码中,你可以在菜单被充满之后访问这个button:

 public boolean onCreateOptionsMenu(Menu menu) { MenuInflater menuInflater = getMenuInflater(); menuInflater.inflate(R.menu.sample, menu); MenuItem getItem = menu.findItem(R.id.get_item); if (getItem != null) { AppCompatButton button = (AppCompatButton) getItem.getActionView(); //Set a ClickListener, the text, the background color or something like that //... } return super.onCreateOptionsMenu(menu); } 

你实际上可以把任何东西放在工具栏中。 看下面的代码。

 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentStart="true" android:background="@color/colorPrimary"> </android.support.v7.widget.Toolbar> 

在上面的工具栏标签之间你几乎可以放任何东西。 这是使用工具栏的好处。

来源: Android工具栏示例