每日一荐APP-01

第一步：MainActivity

　　

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;


public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initToolbar();
        
    }

    private void initToolbar() {
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_main);
        toolbar.setTitle("每日一荐");
        setSupportActionBar(toolbar);
    }
}

2.activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<!--drawerlayout就是实现带有侧滑界面的效果的布局-->
<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <!-- 线性布局 可设置 横向 纵向排列  此处设置为纵向排列-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <!--AppBarLayout继承自LinearLayout，布局方向为垂直方向。-->
        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"><!--简单的引用attr属性值-->

            <!--为了能够正常使用ToolBar，我们需要隐藏原来的ActionBar，这个可以在主题中修改-->
            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar_main"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:titleTextColor="@color/white"
                >
            </android.support.v7.widget.Toolbar>

        </android.support.design.widget.AppBarLayout>


    </LinearLayout>



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

3.colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>


    <color name="primary_text">#333333</color>
    <color name="secondary_text">#cccccc</color>
    <color name="divider">#e1e1e1</color>

    <color name="white">#ffffff</color>
    <color name="gray">#f2f2f2</color>
    <color name="orange_light">#fec107</color>
    <color name="black">#212121</color>
</resources>

4.styles.xml

<resources>

    <!-- Base application theme. -->
    <!--隐藏原来的ActionBar-->
    <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>


</resources>

5.build.gradle

apply plugin: 'com.android.application'

android {
    compileSdkVersion 27
    defaultConfig {
        applicationId "android.coolweather.com.myblogapp"
        minSdkVersion 19
        targetSdkVersion 27
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    //支持包内有能向下兼容的ToolBar
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'com.android.support:appcompat-v7:27.1.1'
    implementation 'com.android.support.constraint:constraint-layout:1.1.2'
    testImplementation 'junit:junit:4.12'
    //引入design库支持
    implementation 'com.android.support:design:27.1.1'
    androidTestImplementation 'com.android.support.test:runner:1.0.2'
    androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

6.运行效果