2014-11-05 21 views
0

enter image description here的是Android 5.0 - 如何从材料设计准则

我没有得到这是动作条,并且是工具栏实现这个平板电脑的布局。 我该如何实施? 任何答案赞赏..感谢提前。

+0

说真的,有大量的文档供您阅读。对于工具栏,ActionBar等看这里:http://android-developers.blogspot.de/2014/10/implementing-material-design-in-your.html或在这里:https://chris.banes.me/2014/10/17/appcompat-v21/etc. – Blacklight 2014-11-05 12:11:18

回答

6

在此示例中,蓝色工具栏是一个扩展高度,覆盖屏幕内容并提供导航按钮。在详细视图中使用了另一个工具栏。我在下面圈出了两个工具栏。

Toolbars

+0

你能帮我把代码给我,让我可以实现它...谢谢你的回复 – 2014-11-06 04:34:19

1

没有试过尚未但它应该工作。这里是你的布局:

<?xml version="1.0" encoding="utf-8"?> 
<!-- The important thing to note here is the added fitSystemWindows --> 

<android.support.v4.widget.DrawerLayout 
    android:id="@+id/drawer_layout" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true"> 

    <!-- Your content --> 
    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical"> 

     <!-- Your main ActionBar (with the blue background). 
      The height is 56 + 72dp according to specs --> 
     <android.support.v7.widget.Toolbar 
      android:id="@+id/main_toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:background="?attr/colorPrimary" 
      android:minHeight="128dp" /> 

     <!-- The white sheet --> 
     <FrameLayout 
      android:id="@+id/content_container" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_marginEnd="64dp" 
      android:layout_marginStart="64dp" 
      android:layout_marginTop="56dp" 
      android:background="@android:color/white"> 

      <!-- This is the secondary toolbar, 72dp also according to specs --> 
      <android.support.v7.widget.Toolbar 
       android:id="@+id/secondary_toolbar" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:background="@android:color/darker_gray" 
       android:minHeight="72dp" /> 

      <!-- Your main frame container where you put your fragment --> 
      <FrameLayout 
       android:id="@+id/frame_container" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent"/> 

     </FrameLayout> 

    </RelativeLayout> 

    <!-- Your drawer view. This can be any view, LinearLayout 
     is just an example. As we have set fitSystemWindows=true 
     this will be displayed under the status bar. --> 
    <LinearLayout 
     android:layout_width="304dp" 
     android:layout_height="match_parent" 
     android:layout_gravity="left|start" 
     android:fitsSystemWindows="true"/> 

</android.support.v4.widget.DrawerLayout> 

这将包括一个NavigationDrawer是那张ActionBar(有关更多信息,read this answer by Chris Banes),并且布局你的要求之上。

然后在你的Fragment/Activity

public void onCreate(Bundled savedInstanceState) { 
    super.onCreate(savedInstanceState); 

    // ... 

    // Set the main Toolbar as the ActionBar 
    Toolbar mainToolbar = (...) findViewById(R.id.main_toolbar); 
    setSupportActionBar(mainToolbar); 

    // Now retrieve the DrawerLayout so that we can set the status bar color. 
    // This only takes effect on Lollipop, or when using translucentStatusBar 
    // on KitKat. 
    DrawerLayout drawerLayout = (...) findViewById(R.id.my_drawer_layout); 
    drawerLayout.setStatusBarBackgroundColor(yourChosenColor); 

    // Use the secondary toolbar in Standalone mode. This means you don't set is as the ActionBar 
    // but it also implies you have to handle the Toolbar items yourslef 
    Toolbar secondaryToolbar = (...) findViewById(R.id.secondary_toolbar); 

    // For example, to set an OnMenuItemClickListener to handle menu item clicks : 
    toolbar.setOnMenuItemClickListener(
      new Toolbar.OnMenuItemClickListener() { 
       @Override 
       public boolean onMenuItemClick(MenuItem item) { 
        // Handle the menu item 
        return true; 
       } 
    }); 

    // To inflate a menu to be displayed in the toolbar : 
    toolbar.inflateMenu(R.menu.your_toolbar_menu); 

    // ... 
} 

我想这应该做到这一点(不要忘记尺寸来代替硬编码值以适应设备的大小)。

欲了解更多信息,请看the AppCompat v21 docChris Banes' post on the AppCompat v21