2015-08-29 2 views
0

Я хочу создать Android ActionBar, который выглядит следующим образом.Android ActionBar с пользовательскими значками?

enter image description here

Как я могу построить такую ​​ActionBar. Можно ли построить его с помощью Android Material Design?

+0

Вкладки планшета - то, что у вас есть слева - были устарели как шаблон дизайна с Android 5.0 и не являются частью Material Design. Документация по материальному дизайну [описывает их схемы вкладок] (https://www.google.com/design/spec/components/tabs.html). – CommonsWare

+0

Есть ли что-то похожее на то, что я показываю на картинке с материальным дизайном? – confile

+0

Не то, чтобы я помню. – CommonsWare

ответ

1

Я хотел бы использовать новый ToolBar от Android Design Library Поддержка

http://android-developers.blogspot.it/2015/05/android-design-support-library.html

Использование ToolBar вместо ActionBar даст вам больше контроля над самими элементами.

Вы можете найти хорошую статью здесь:

http://www.android4devs.com/2014/12/how-to-make-material-design-app.html

enter image description here

app_bar.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/appBar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:background="#3F51B5" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark" > 
    <FrameLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 
     <android.support.design.widget.TabLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="left" 
      android:id="@+id/tabLayout"/> 
    </FrameLayout> 
</android.support.v7.widget.Toolbar> 

main_activity_layout.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="wrap_content" 
    tools:context=".MainActivity"> 
    <include layout="@layout/app_bar" /> 
</RelativeLayout> 

main_activity_onCreate()

toolBar = (Toolbar) findViewById(R.id.appBar); 
toolBar.setTitle("Titolo"); 
setSupportActionBar(toolBar); 

tabLayout = (TabLayout) findViewById(R.id.tabLayout); 
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.user)); 
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.user_group_1)); 
tabLayout.addTab(tabLayout.newTab().setIcon(R.drawable.user_group_2)); 

styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 
    <!-- Customize your theme here. --> 
</style> 
+0

Пожалуйста, объясните, как 'Toolbar' будет решать проблему OP. Просто потому, что он «даст вам больше контроля над самими элементами», не означает, что 'Toolbar' напрямую поддерживает пользовательский интерфейс, который ищет OP, и не определяет, поддерживается ли это Material Design. – CommonsWare

+0

Я думаю, что я объяснил –

0

Технически можно склеивать такое расположение с множеством элементов. Например, у вас есть макет заголовка, содержащий TabLayout слева и панель инструментов с правой стороны, вместо использования стандартного ActionBar.

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="?attr/actionBarSize" 
    android:orientation="horizontal"> 

    <android.support.design.widget.TabLayout 
     android:layout_width="0dp" 
     android:layout_height="match_parent" 
     android:layout_weight="1" /> 

    <android.support.v7.widget.Toolbar 
     android:layout_width="0dp" 
     android:layout_height="match_parent" 
     android:layout_weight="1" /> 

</LinearLayout> 

В этом примере используется AppCompat v7 и библиотека поддержки дизайна.

Вы можете создавать представления в некотором роде (например, один и тот же цвет фона), чтобы он выглядел как один его единственный элемент интерфейса.

Смежные вопросы