2015-12-28 28 views
1

我製作了材料設計工具欄。菜單項包括購物車。我想要一個數字與購物車圖標一起顯示,以指示購物車中存在的物品數量。將TextView添加到工具欄的元素中

toolbar.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:background="@color/colorPrimary" 
android:minHeight="?attr/actionBarSize" 
android:theme="@style/ThemeOverlay.AppCompat.Light" 
android:id="@+id/tool_bar" 
android:elevation="6dp"> 

menu_cart.xml

<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:app="http://schemas.android.com/apk/res-auto"> 
<item android:id="@+id/action_cart" android:icon="@drawable/bag" 
    android:title="Cart" 
    android:orderInCategory="100" app:showAsAction="always" /> 
    </menu> 

TextView的應該是在車圖標的上方顯示隱藏這一點,也許。不是購物車圖標旁邊的文本視圖。

事情是這樣的 -

enter image description here

+0

爲什麼不把普通的截圖? – piotrek1543

+0

這個使用你應該使用coordinativelayout,進入它相對佈局,把一個白色的袋子繪製,在右下角的藍色圓圈。 TextView將被設置爲這個藍色圓圈的alignParentCenter – piotrek1543

+0

@ piotrek1543我已經放了一個截圖。請檢查。 – TeeKay

回答

1

首先,請了解如何創建自己的自定義工具欄。

搜索題目是這樣的:http://code.tutsplus.com/tutorials/getting-started-with-android-creating-a-customized-toolbar--cms-24223

然後你就可以創建工具欄,如下;-)

這是你的崇拜者工具欄的例子

 <ImageView 
      android:id="@+id/shopping_bag" 
      android:layout_width="44dp" 
      android:layout_height="44dp" 
      android:src="@drawable/bag" 
      android:layout_alignParentLeft="true" 
      android:layout_centerInParent="true"></ImageView> 

     <ImageView 
      android:id="@+id/arrow" 
      android:layout_width="48dp" 
      android:layout_height="wrap_content" 
      android:src="@drawable/usability_bidirectionality_guidelines_when3" 
      android:layout_alignParentRight="true"></ImageView> 

     <ImageView 
      android:id="@+id/number" 
      android:layout_width="20dp" 
      android:layout_height="20dp" 
      android:src="@drawable/one" 
      android:layout_alignTop="@+id/shopping_bag" 
      android:layout_alignRight="@+id/shopping_bag"/> 

    </RelativeLayout> 

,它看起來像:

enter image description here

爲了有一個更好看,發現材料設計靈感的圖標。

希望它有幫助

+0

我要在哪裏添加代碼?在tool_bar.xml中?\ – TeeKay

+0

我已編輯我的帖子 – piotrek1543

+1

工作!非常感謝 :) – TeeKay