Fügen Sie ein benutzerdefiniertes Layout zur Symbolleiste hinzu

Question

Ich folgte dieser tutorial, um meiner App eine normale Symbolleiste mit einigen Registerkarten zu geben.

Ich möchte die Symbolleiste ändern, damit es mehr wie folgt aussieht:

ich einige Texte und Bilder in die Symbolleiste hinzufügen möchten. Wie kann ich das machen?

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> 

Answer 1

Sie können dies versuchen: -

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

Answer 2

Das Android ActionBar ist jetzt einfacher als je zuvor zu gestalten, aufgrund der Tatsache, dass das alte ActionBar Element mit ersetzt wurde die vielseitige Toolbar. Weitere Informationen detail reference link 1 und detail reference link 2

Answer 3

Sie können benutzerdefiniertes ToolBar-Layout mithilfe des Einschränkungslayouts definieren, siehe unten, siehe http://www.zoftino.com/android-toolbar-tutorial für weitere Informationen.

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