添加自定义布局到工具栏

我遵循这个教程给我的应用程序一个常规的工具栏,一些标签。

我想改变工具栏,看起来更像这样:

在这里输入图像说明

我想添加一些文字和图像到工具栏中。 我怎样才能做到这一点?

activity_main.xml

 <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:elevation="0dp"> <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="@color/primary" app:layout_scrollFlags="scroll|enterAlways" app:theme="@style/ToolbarTheme" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabTextAppearance="@style/TabLayout" app:tabSelectedTextColor="@color/white" /> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> </android.support.design.widget.CoordinatorLayout> 

你可以试试这个:

 <android.support.design.widget.CoordinatorLayout 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:id="@+id/main_container" android:layout_width="match_parent" android:layout_height="match_parent"> <!- Your view --> <android.support.design.widget.AppBarLayout android:id="@+id/appbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:elevation="6dp" android:fitsSystemWindows="true" android:theme="@style/AppTheme"> <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:id="@+id/toolbar" android:layout_height="?attr/actionBarSize" android:elevation="6dp" app:layout_collapseMode="pin" app:layout_scrollFlags="scroll|enterAlways" app:popupTheme="@style/AppTheme"> <LinearLayout android:id="@+id/llContainer" android:layout_width="match_parent" android:orientation="vertical" android:background="@android:color/black" android:gravity="center" android:layout_height="300dp"> <!- Your TextView / ImageView --> </LinearLayout> </android.support.v7.widget.Toolbar> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabTextAppearance="@style/TabLayout" app:tabSelectedTextColor="@color/white"/> </android.support.design.widget.AppBarLayout> <android.support.v4.view.ViewPager android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_behavior="@string/appbar_scrolling_view_behavior" /> </android.support.design.widget.CoordinatorLayout> 

由于旧的ActionBar元素已经被更多的工具条取代,Android ActionBar现在比以往更容易定制。 有关更多详细信息,请参阅链接1和详细参考链接2

您可以使用约束布局定义工具栏自定义布局,如下所示,更多信息请参见http://www.zoftino.com/android-toolbar-tutorial

 <?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout 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="zoftino.com.toolbar.MainActivity"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:minHeight="?attr/actionBarSize" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"> <android.support.constraint.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginBottom="8dp"> <TextView android:id="@+id/title_m" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginEnd="8dp" android:layout_marginStart="8dp" android:layout_marginTop="16dp" android:text="Tennis" android:textAppearance="@android:style/TextAppearance.Material.Title" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent"/> <TextView android:id="@+id/women_s" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginEnd="8dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:text="W Singles" android:textAppearance="@android:style/TextAppearance.Material.Medium" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/title_m" /> <TextView android:id="@+id/wm_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginEnd="8dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:textAppearance="@android:style/TextAppearance.Material.Title" android:text="Serena" app:layout_constraintLeft_toRightOf="@+id/women_s" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toBottomOf="@+id/title_m" /> </android.support.constraint.ConstraintLayout> </android.support.v7.widget.Toolbar> </android.support.constraint.ConstraintLayout>