Android Design Support Library高逼格金錢豹製作教程

來源:互聯網
上載者:User

最近項目不是很忙,終於有時間寫部落格啦,趁這幾天用Android的一些新特性重新寫了金錢豹的架構,先上看圖,和之前的原版相比不知道大家更喜歡哪種。


前幾天Devin給我開通了vpn,作為Google腦殘粉,晚上默默下載了各種最新的Tools,帶著我對Material Design的喜愛,正式開始啃Google官網。吐槽下技術是永遠學不完的,實際上兩個月前,我已經學了些Material Design,我還沒來得及使用,現在那部分內容已經是被淘汰、廢棄掉的技術了……

Ok,這次就講解下NavigationView的使用,這是Android Lolipop中Android Design Support Library帶來的Material design Components中推出的,此次的Components中還包含floating labels for editing text, a floating action button, snackbar, tabs。

Google的解釋:

The navigation drawer can be an important focal point for identity and navigation within
your app and consistency in the design here can make a considerable difference in how easy your app is to navigate, particularly for first time users.NavigationView makes this easier by providing the framework you need for the navigation drawer as well as the ability to inflate your navigation items through a menu resource.

此前,drawertoolge+actionbar是標配,例如Google自己的GooglePlay,而這次Google的意思是navigationbar更加簡易使用,只需要填充menu資源即可實現,基本不需要考慮過多的邏輯了,google已經將Actionbar和廢棄了,使用Toolbar來代替,這邊順便說一句經驗,也是這幾天遇到的一個bug,就是要關注Google廢棄的東西,要保持警惕有準備,以前我覺得廢棄一個API沒什麼大不了的,廢棄了一樣能用,但是在這次最新的更新中,Google廢棄了Apache的一個Api,使得我一直使用的非同步請求方式不能再使用,那天也算是運氣好,正好讀Google官方更新內容的時候提到了這個廢棄Api和解決方案,否則這個bug根本不可能給解決了,因為這個問題實在太新了,直接搜尋的話,基本不可能找到解決方案,只能換一種請求方式了,這也讓我更理解為什麼大牛們都推薦上Google找答案的原因,這個bug要在百度找到估計還得等個半年一年或者根本找不到。
言歸正傳,使用navigation需要搭配Drawerlayout一起配合使用


<android.support.v4.widget.DrawerLayout       
 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:fitsSystemWindows="true">
<!-- your content layout -->
<android.support.design.widget.NavigationView           
 android:layout_width="wrap_content"           
 android:layout_height="match_parent"           
 android:layout_gravity="start"           
 app:headerLayout="@layout/drawer_header"           
 app:menu="@menu/drawer"/>
</android.support.v4.widget.DrawerLayout>

Header的布局和普通xml是一樣的,主要就是menu_drawer的編寫。
主要是兩種方式:1、group內部填充item 2、item可以包含字item

下面是Google官方的樣本:

The simplest drawer menus will be a collection of checkable menu items:

<group android:checkableBehavior="single">
    <item
        android:id="@+id/navigation_item_1"
        android:checked="true"
        android:icon="@drawable/ic_android"
        android:title="@string/navigation_item_1"/>
    <item
        android:id="@+id/navigation_item_2"
        android:icon="@drawable/ic_android"
        android:title="@string/navigation_item_2"/>
</group>
The checked item will appear highlighted in the navigation drawer, ensuring the user knows which navigation item is currently selected.

選中的item會自動高亮提示使用者。


<item
    android:id="@+id/navigation_subheader"
    android:title="@string/navigation_subheader">
    <menu>
        <item
            android:id="@+id/navigation_sub_item_1"
            android:icon="@drawable/ic_android"
            android:title="@string/navigation_sub_item_1"/>
        <item
            android:id="@+id/navigation_sub_item_2"
            android:icon="@drawable/ic_android"
            android:title="@string/navigation_sub_item_2"/>
    </menu>
</item>

監聽:

OnNavigationItemSelectedListener using setNavigationItemSelectedListener(). This provides you with the MenuItem that was clicked, allowing you to handle selection events, changed the checked status, load new content, programmatically close the drawer, or any other actions you may want.
Navigationview的介面是寫好的。設定setNavigationItemSelectedListener()的監聽,傳遞參數後,會在OnNavigationItemSelected中將MenuItem傳遞給使用者,在這邊實現操作即可。

更多的內容我會在後期繼續整理髮布,只要時間允許,Google推出新的技術我也會第一時間學習並整理髮布

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.