マテリアルデザインガイドラインで提案されている次の画像のようなツールバーを作成します。
相対レイアウトのツールバーを使用してこれを実現できます:
<RelativeLayout
Android:layout_width="match_parent"
Android:layout_height="wrap_content" >
<Toolbar/>
<LinearLayout Android:layout_marginTop="-17dp" />
</RelativeLayout>
これが正しい方法かどうかはわかりません。どんな助けでもありがたいです。
すべての助けをありがとうガブリエレ。ここに作業コードがあります:
活動:
public class MainActivity extends ActionBarActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_mai);
Toolbar toolbar = (Toolbar) findViewById(R.id.card_toolbar);
if (toolbar != null) {
// inflate your menu
toolbar.inflateMenu(R.menu.main);
toolbar.setTitle("Card Toolbar");
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
return true;
}
});
}
Toolbar maintoolbar = (Toolbar) findViewById(R.id.toolbar_main);
if (maintoolbar != null) {
// inflate your menu
maintoolbar.inflateMenu(R.menu.main);
maintoolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
return true;
}
});
}
}
}
レイアウト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" >
<Android.support.v7.widget.Toolbar
Android:id="@+id/toolbar_main"
Android:layout_width="match_parent"
Android:layout_height="@dimen/action_bar_size_x2"
Android:background="@Android:color/holo_orange_dark"
Android:minHeight="?attr/actionBarSize" />
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:layout_below="@+id/toolbar_main"
Android:layout_marginLeft="15dp"
Android:layout_marginRight="15dp"
Android:layout_marginTop="@dimen/action_bar_size"
Android:orientation="vertical" >
<Android.support.v7.widget.CardView
Android:layout_width="match_parent"
Android:layout_height="match_parent" >
<LinearLayout
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:orientation="vertical" >
<Android.support.v7.widget.Toolbar
Android:id="@+id/card_toolbar"
Android:layout_width="match_parent"
Android:layout_height="@dimen/action_bar_size"
Android:background="@Android:color/white" />
<View
Android:layout_width="match_parent"
Android:layout_height="1dp"
Android:background="@Android:color/darker_gray" />
<TextView
Android:layout_width="match_parent"
Android:layout_height="wrap_content"
Android:layout_margin="10dp"
Android:text="@string/app_name"
Android:textSize="24sp" />
</LinearLayout>
</Android.support.v7.widget.CardView>
</LinearLayout>
</RelativeLayout>
アクティビティのテーマが拡張されていることを確認してくださいTheme.AppCompat.Light.NoActionBar
。
これは次のようになります。
注意事項が少ない:
ActionBar、CardView、およびカード内の別のツールバー(スタンドアロン)としてツールバーを使用して取得できます。
カード内のツールバースタンドアロンの場合、次のようなものを使用できます。
<Android.support.v7.widget.CardView>
<LinearLayout>
<Toolbar Android:id="@+id/card_toolbar" />
//......
</LinearLayout>
</CardView>
次に、メニューを膨らませて、アイコンのアクションを取得できます。
Toolbar toolbar = (Toolbar) mActivity.findViewById(R.id.card_toolbar);
if (toolbar != null) {
//inflate your menu
toolbar.inflateMenu(R.menu.card_toolbar);
toolbar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem menuItem) {
//.....
}
});
}
アクションバーとして使用されるツールバーと使用できるメインレイアウトの場合:
option1:
<RelativeLayout>
<toolbar/> //Main toolbar
<View
Android:background="@color/primary_color"
Android:layout_height="@dimen/subtoolbar_height"/>
<CardView /> //described above
</RelativeLayout>
Option2:拡張された toolbar (アクションバーとして)と、上記のマージンで遊んでいるCardView。