欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android實(shí)現(xiàn)酷炫的頂部欄

 更新時(shí)間:2016年09月01日 09:30:11   作者:qq_20785431  
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)酷炫的頂部欄,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下

AppBarLayout 是繼承LinerLayout實(shí)現(xiàn)的一個(gè)ViewGroup容器組件,它是為了Material Design設(shè)計(jì)的App Bar,支持手勢(shì)滑動(dòng)操作的,不過(guò)經(jīng)常與Toolbar、CoordinatorLayout以及CollapsingToolbarLayout等一起配合使用,在說(shuō)到AppBarLayout之前,我們先簡(jiǎn)單學(xué)習(xí)一下Toolbar。和往常一樣,主要還是想總結(jié)一下我在學(xué)習(xí)過(guò)程中的一些筆記以及一些需要注意的地方。

一、Toolbar

Toolbar是在 Android 5.0 開(kāi)始推出的一個(gè) Material Design 風(fēng)格的導(dǎo)航控件 ,Google 非常推薦大家使用 Toolbar 來(lái)作為Android客戶端的導(dǎo)航欄,以此來(lái)取代之前的 Actionbar,也就是說(shuō),ActionBar能做的,Toolbar都能做 。與 Actionbar 相比, Toolbar 要靈活的多。它不像 Actionbar 一樣,一定要固定在Activity的頂部,而是可以放到界面的任意位置。除此之外,在設(shè)計(jì) Toolbar 的時(shí)候,Google也留給我們很多可以修改的余地

 •設(shè)置導(dǎo)航欄圖標(biāo)
 •設(shè)置App的logo
 •設(shè)置標(biāo)題和子標(biāo)題
 •添加一個(gè)或多個(gè)的自定義控件
 •設(shè)置Action Menu 

為了容易理解,我們先看看效果圖:

按照效果圖,從左到右分別是導(dǎo)航欄圖標(biāo) 、App的logo 、 標(biāo)題和子標(biāo)題 、 自定義控件(一個(gè)TextView和ImageView) 以及 ActionMenu

1、用Toolbar的時(shí)候,首先要隱藏原本的ActionBar
(1)通過(guò)在我們的styles.xml文件中的AppTheme標(biāo)簽中設(shè)置以下屬性:

<item name="windowActionBar">false</item>
<item name="android:windowNoTitle">true</item>

(2)通過(guò)修改我們繼承的主題為:Theme.AppCompat.Light.NoActionBar

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorPrimary">@color/blue</item>
  <item name="colorPrimaryDark">@color/blue_dark</item>
  <item name="colorAccent">@color/red</item>
  <item name="textAllCaps">false</item>
 </style>

(3)在Activity中調(diào)用下面這句,去掉了默認(rèn)的導(dǎo)航欄

supportRequestWindowFeature(Window.FEATURE_NO_TITLE);

2、在布局文件中添加我們需要的Toolbar控件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical">

 <android.support.v7.widget.Toolbar
  android:id="@+id/toolbar"
  android:layout_width="match_parent"
  android:layout_height="?android:actionBarSize"
  android:background="?attr/colorPrimary">
  <!--自定義控件-->
  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="點(diǎn)擊" />

  <ImageView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginLeft="2dp"
   android:src="@mipmap/icon" />
 </android.support.v7.widget.Toolbar>
</LinearLayout>

3、接著在 menu_main.xml 中添加 action menu 菜單項(xiàng)

<menu xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto">
 <item
  android:id="@+id/add"
  android:icon="@mipmap/icon_add"
  app:showAsAction="always" />
 <item
  android:id="@+id/add_friend"
  android:title="添加朋友"
  app:showAsAction="never" />
 <item
  android:id="@+id/scace"
  android:title="掃一掃"
  app:showAsAction="never" />
</menu>

4、在Activity 中初始化Toolbar 控件,并設(shè)置相對(duì)應(yīng)的屬性

package per.lijuan.appbarlayoutdome;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.Window;
import android.widget.Toast;

/**
 * Created by lijuan on 2016/8/31.
 */
public class Activity extends AppCompatActivity {
 private Toolbar toolbar;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  supportRequestWindowFeature(Window.FEATURE_NO_TITLE);
  setContentView(R.layout.activity_second);
  toolbar = (Toolbar) findViewById(R.id.toolbar);

  /**
   * 設(shè)置標(biāo)題
   */
  toolbar.setTitle("標(biāo)題");
  /**
   * 設(shè)置子標(biāo)題
   */
  toolbar.setSubtitle("子標(biāo)題");
  /**
   * 設(shè)置App的logo
   */
  toolbar.setLogo(R.mipmap.ic_launcher);
  /**
   * 設(shè)置導(dǎo)航按鈕
   */
  toolbar.setNavigationIcon(R.mipmap.back);
  setSupportActionBar(toolbar);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  getMenuInflater().inflate(R.menu.menu_main, menu);
  return true;
 }

 /**
  * 設(shè)定菜單各按鈕的動(dòng)作
  *
  * @return
  */
 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
  switch (item.getItemId()) {
   case android.R.id.home:
    finish();
    break;
   case R.id.add:
    Toast.makeText(SecondActivity.this, "添加", Toast.LENGTH_SHORT).show();
    break;
   case R.id.add_friend:
    Toast.makeText(SecondActivity.this, "添加朋友", Toast.LENGTH_SHORT).show();
    break;
   case R.id.scace:
    Toast.makeText(SecondActivity.this, "掃一掃", Toast.LENGTH_SHORT).show();
    break;
   default:
    break;
  }
  return super.onOptionsItemSelected(item);
 }
}

二、CollapsingToolbarLayout

CollapsingToolbarLayout作用是提供了一個(gè)可以折疊的Toolbar,它繼承至FrameLayout,給它設(shè)置layout_scrollFlags,它可以控制包含在CollapsingToolbarLayout中的控件(如:ImageView、Toolbar)在響應(yīng)layout_behavior事件時(shí)作出相應(yīng)的scrollFlags滾動(dòng)事件(移除屏幕或固定在屏幕頂端)

三、AppBarLayout

我們來(lái)看看最終的效果圖:

從效果圖來(lái)看,當(dāng)設(shè)置了layout_behavior的控件響應(yīng)起了CollapsingToolbarLayout中的layout_scrollFlags事件時(shí),ImageView會(huì)有視差效果的向上滾動(dòng)移除屏幕,當(dāng)開(kāi)始折疊時(shí),CollapsingToolbarLayout的背景色(也就是Toolbar的背景色)就會(huì)變?yōu)槲覀冊(cè)O(shè)置好的背景色,Toolbar也一直會(huì)固定在最頂端

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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.design.widget.AppBarLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

  <android.support.design.widget.CollapsingToolbarLayout
   android:id="@+id/collapsing_toolbar_layout"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   app:contentScrim="#3F51B5"
   app:layout_scrollFlags="scroll|exitUntilCollapsed">

   <ImageView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:adjustViewBounds="true"
    android:src="@mipmap/icon_bg"
    app:layout_collapseMode="parallax"
    app:layout_collapseParallaxMultiplier="0.5" />

   <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="56dp"
    app:layout_collapseMode="pin"
    app:title="@string/app_name"
    app:titleTextColor="#FFFFFF" />

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

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

 <android.support.v7.widget.RecyclerView
  android:id="@+id/recyclerview"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

(1)我們?cè)贑ollapsingToolbarLayout中設(shè)置了一個(gè)ImageView和一個(gè)Toolbar,并將這個(gè)CollapsingToolbarLayout作為一個(gè)整體放在AppBarLayout中

(2)在CollapsingToolbarLayout中,我們?cè)O(shè)置了app:layout_scrollFlags="scroll|enterAlwaysCollapsed",它的值還包括:
 •scroll - 想滾動(dòng)就必須設(shè)置這個(gè),也就是說(shuō)值設(shè)為scroll的View會(huì)跟隨滾動(dòng)事件一起滾動(dòng)
◦enterAlways - 值設(shè)為enterAlways的View,當(dāng)RecyclerView往下滾動(dòng)時(shí),該View會(huì)直接往下滾動(dòng)
 ◦exitUntilCollapsed - 值設(shè)為exitUntilCollapsed的View,當(dāng)這個(gè)View要往上逐漸“消逝”時(shí),會(huì)一直往上滑動(dòng),直到剩下的的高度達(dá)到它的最小高度后,再響應(yīng)RecyclerView的內(nèi)部滑動(dòng)事件。
 ◦enterAlwaysCollapsed - 當(dāng)值設(shè)為enterAlwaysCollapsed 的View已經(jīng)設(shè)置minHeight屬性又使用此標(biāo)志時(shí),這個(gè)View只能以最小高度進(jìn)入,只有當(dāng)滾動(dòng)視圖到達(dá)頂部時(shí)才擴(kuò)大到完整高度 

另外app:contentScrim="#3F51B5"是指當(dāng)完全CollapsingToolbarLayout折疊(收縮)后的背景顏色

(3)在ImageView控件中,我們?cè)O(shè)置了app:layout_collapseMode="parallax",layout_collapseMode (折疊模式) - 有兩個(gè)值:
 •pin - 設(shè)置為這個(gè)模式時(shí),當(dāng)CollapsingToolbarLayout完全收縮后,Toolbar還可以保留在屏幕上
 •parallax - 設(shè)置為這個(gè)模式時(shí),在內(nèi)容滾動(dòng)時(shí),CollapsingToolbarLayout中的View(比如ImageView)也可以同時(shí)滾動(dòng),實(shí)現(xiàn)視差滾動(dòng)效果,通常和layout_collapseParallaxMultiplier(設(shè)置視差因子)搭配使用 

另外app:layout_collapseParallaxMultiplier="0.5"設(shè)置視差滾動(dòng)因子,值為:0~1

(4)在Toolbar控件中,我們?cè)O(shè)置了layout_collapseMode(折疊模式):為pin

MainActivity.class

package com.per.appbarlayout;

import android.graphics.Color;
import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {
 public Toolbar mToolbar;
 private RecyclerView mRecyclerView;

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

  mToolbar = (Toolbar) findViewById(R.id.toolbar);
  mToolbar.setTitleTextColor(Color.GREEN);
  mToolbar.setTitle("AppBarLayout");
  setSupportActionBar(mToolbar);

  getSupportActionBar().setHomeButtonEnabled(true);
  getSupportActionBar().setDisplayHomeAsUpEnabled(true);

  mRecyclerView = (RecyclerView) findViewById(R.id.recyclerview);
  mRecyclerView.setLayoutManager(new LinearLayoutManager(this));
  mRecyclerView.setAdapter(new ContentAdapter());

  CollapsingToolbarLayout mCollapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar_layout);
  //通過(guò)CollapsingToolbarLayout設(shè)置title
  mCollapsingToolbarLayout.setTitle("AppBarLayout");
  //通過(guò)CollapsingToolbarLayout修改字體顏色
  mCollapsingToolbarLayout.setExpandedTitleColor(Color.WHITE);//設(shè)置還沒(méi)收縮時(shí)狀態(tài)下字體顏色
  mCollapsingToolbarLayout.setCollapsedTitleTextColor(Color.RED);//設(shè)置收縮后Toolbar上字體的顏色
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  getMenuInflater().inflate(R.menu.menu_main, menu);
  return true;
 }

 @Override
 public boolean onOptionsItemSelected(MenuItem item) {
  switch (item.getItemId()) {
   case android.R.id.home:
    finish();
    break;
  }
  return super.onOptionsItemSelected(item);
 }

 private class ContentAdapter extends RecyclerView.Adapter<ContentAdapter.ContentHolder> {
  @Override
  public ContentAdapter.ContentHolder onCreateViewHolder(ViewGroup parent, int viewType) {
   return new ContentHolder(LayoutInflater.from(MainActivity.this).inflate(android.R.layout.simple_list_item_1, parent, false));
  }

  @Override
  public void onBindViewHolder(ContentAdapter.ContentHolder holder, int position) {
   holder.itemTv.setText("item");
  }

  @Override
  public int getItemCount() {
   return 35;
  }

  class ContentHolder extends RecyclerView.ViewHolder {

   private TextView itemTv;

   public ContentHolder(View itemView) {
    super(itemView);
    itemTv = (TextView) itemView.findViewById(android.R.id.text1);
   }
  }
 }
}

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論