Material Design控件使用(一)

Google 發(fā)布的Material Design支持庫,對我們的APP設(shè)計有很大的影響,
如果重新設(shè)計APP,支持庫應該直接用V4提升到V7了,我們可以用Toolbar代替ActionBar,
以及引入了RecycleView, SnakeBar等新控件。

我寫了一個Demo來學習使用這些新控件。

新建項目,加入依賴包

我們使用Android Studio來開發(fā)這個Demo,在Android Studio新建一個項目,
修改App Module的build.gradle文件,把compileSdkVersion和targetSdkVersion改為21,
因為Material Design支持庫需要Android 5.0以上作為編譯SDK。
同時要加入相關(guān)依賴包design和RecyclerView支持包。

android {
    compileSdkVersion 21
    buildToolsVersion "21.1.2"

    defaultConfig {
        applicationId "materia.aswifter.com.materialexample"
        minSdkVersion 15
        targetSdkVersion 21
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:design:22.2.0'
    compile 'com.android.support:recyclerview-v7:22.0.+'
}

新建Layout

新建activity_main.xml,在其中我們加入Toolbar和RecyclerView

<RelativeLayout 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.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="?attr/colorPrimaryDark">
   </android.support.v7.widget.Toolbar>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/toolbar"
        android:scrollbars="none" />

</RelativeLayout>

新建Activity

新建MainActivity繼承自AppCompatActivity

  • 加入ToolBar
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
  • 使用RecyclerView
    RecyclerView是用來替換ListView的,它在里面封裝ViewHolder的一些處理,
    不過RecyclerView沒有setOnItemClickListener方法,需要自己實現(xiàn)。
       mRecyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        // use this setting to improve performance if you know that changes
        // in content do not change the layout size of the RecyclerView
        mRecyclerView.setHasFixedSize(true);

        // use a linear layout manager
        mLayoutManager = new LinearLayoutManager(this);
        mRecyclerView.setLayoutManager(mLayoutManager);

        // specify an adapter (see also next example)
        myDataset = new String[]{"JAVA", "Objective-C", "C", "C++", "Swift",
                "GO", "JavaScript", "Python", "Ruby", "HTML", "SQL"};
        mAdapter = new MyAdapter(myDataset);
        mRecyclerView.setAdapter(mAdapter);
  • 使用Snackbar
    Snackbar的使用類似于Toast,我在RecyclerView的Item的點擊事件中調(diào)用Snackbar,
    顯示TextView中的文字。
 public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
            // each data item is just a string in this case
            public TextView mTextView;

            public ViewHolder(View v) {
                super(v);
                mTextView = (TextView) v.findViewById(R.id.textView);
                v.setOnClickListener(this);
            }

            @Override
            public void onClick(View view) {
                Snackbar.make(view, mTextView.getText(), Snackbar.LENGTH_SHORT).show();
            }
        }

項目源碼已發(fā)布到Github,以后慢慢加入其他控件的使用。
源碼地址:MaterialDesignExample

本文作者: 陽春面
原文地址:http://www.aswifter.com/2015/06/24/Material-Design-Example-1/

歡迎關(guān)注我的微信公眾號,分享Android 開發(fā),IOS開發(fā),Swift開發(fā)和互聯(lián)網(wǎng)內(nèi)容
微信號:APP開發(fā)者

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容