接上一篇文章,地址:Android學習筆記:界面設計Material Design的基本使用方法(一)
本文使用到的圖片資源地址:https://pan.baidu.com/s/1c2PpZ0k
四、卡片式佈局
1、使用CardView實現卡片式佈局
CardView由appcompat-v7庫提供,它也是一個FrameLayout,只是額外的提供了圓角和陰影等效果。
CardView的使用方法:
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="5dp"
app:cardCornerRadius="4dp">
<TextView
android:id="@+id/fruit_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.v7.widget.CardView>
代碼含義很好理解,其中:
app:elevation="5dp" //指定卡片高度
app:cardCornerRadius="4dp" //指定卡片圓角弧度
這樣這個TextView就顯示在一個卡片中了。
下面開始使用CardView佈局。項目目標:使用RecyclerView填充主界面,實現水果圖片的列表展現。
使用準備:
①、準備好水果圖片資源(可以在我給的圖片資源中找到)。放入drawable下。
②、添加庫依賴。
因爲會使用到CardView、RecyclerView和Glide庫來實現,所以在(preject模式)app/build.gradle中添加三個依賴。
dependencies {
...
compile 'com.android.support:recyclerview-v7:25.3.1'
compile 'com.android.support:cardview-v7:25.3.1'
compile 'com.github.bumptech.glide:glide:3.7.0'
}
然後點擊 Sync Now進行同步。Glide庫是一個超級強大的加載圖片的開源項目。
Glide開源項目地址:https://github.com/bumptech/glide
準備完成後開始具體實現:
(1)、修改activity_main.xml的代碼,使RecyclerView填充整個主界面。
在Toolbar和FloatingActionButton標籤的中間加入以下代碼:
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
(2)使用RecyclerView
①、創建Fruit實體類,包括水果名、資源ID和getter方法。
package com.my.materialdesigntest;
public class Fruit {
private String name; //水果名
private int imageId; //資源ID
public Fruit(String name, int imageId) {
this.name = name;
this.imageId = imageId;
}
public String getName() {
return name;
}
public int getImageId() {
return imageId;
}
}
②、爲RecyclerView子項自定義佈局
在layout目錄下新建fruit_item.xml文件。修改爲以下代碼:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
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="wrap_content"
android:layout_margin="5dp"
app:cardCornerRadius="4dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/fruit_image"
android:layout_width="match_parent"
android:layout_height="100dp"
android:scaleType="centerCrop" />
<TextView
android:id="@+id/fruit_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="5dp"
android:textSize="16sp" />
</LinearLayout>
</android.support.v7.widget.CardView>
最外層使用CardView佈局,代碼很好理解,值得注意的是:android:scaleType="centerCrop",這條語句的含義是:指定圖片的縮放模式,若水果圖片的長寬比例不同,爲了能讓圖片能填充整個ImageView,使用centerVrop模式,可以使圖片保持原有比例填充ImageView,並將多餘部分裁剪掉。
③、爲RecyclerView自定義適配器
新建FruitAdapter類,繼承RecyclerView.Adapter,並指定泛型爲FruitAdapter.ViewHolder,代碼如下:
package com.my.materialdesigntest;
import android.content.Context;
import android.support.v7.widget.CardView;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import com.bumptech.glide.Glide;
import java.util.List;
public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {
private Context mContext; //上下文
private List<Fruit> mFruitList; //裝載水果信息的列表
//構造函數,傳入數據源
public FruitAdapter(List<Fruit> mFruitList) {
this.mFruitList = mFruitList;
}
static class ViewHolder extends RecyclerView.ViewHolder {
private CardView cardView; //RecyclerView子項的最外層佈局
private ImageView fruitImage;
private TextView fruitName;
public ViewHolder(View view) {
super(view);
cardView = (CardView) view; //RecyclerView子項最外層佈局
fruitImage = (ImageView) view.findViewById(R.id.fruit_image);
fruitName = (TextView) view.findViewById(R.id.fruit_name);
}
}
//必須重寫的第一個方法:創建ViewHolder方法
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (mContext == null) {
mContext = parent.getContext();
}
//加載子項佈局
View view = LayoutInflater.from(mContext).inflate(R.layout.fruit_item, parent, false);
//創建ViewHolder實例
final ViewHolder holder = new ViewHolder(view);
return holder;
}
//必須重寫的第二個方法:對子項數據賦值
@Override
public void onBindViewHolder(ViewHolder holder, int position) {
//獲取當前項的水果實例
Fruit fruit = mFruitList.get(position);
//賦值
holder.fruitName.setText(fruit.getName());
//根據資源ID獲取水果圖片資源並填充ImageView
Glide.with(mContext).load(fruit.getImageId()).into(holder.fruitImage);
}
//必須重寫的第三個方法:獲取所有子項的個數
@Override
public int getItemCount() {
return mFruitList.size();
}
}
按照註釋很容易理解。
(3)、修改MainActivity中的代碼:
public class MainActivity extends AppCompatActivity {
private DrawerLayout mDrawerLayout; //DrawerLayout佈局,用於實現滑動菜單
//將水果信息裝填到水果數組中
private Fruit[] fruits = {new Fruit("Apple", R.drawable.apple), new Fruit("Banana", R.drawable.banana),
new Fruit("Orange", R.drawable.orange), new Fruit("Watermelon", R.drawable.watermelon),
new Fruit("Pear", R.drawable.pear), new Fruit("Grape", R.drawable.grape),
new Fruit("Pineapple", R.drawable.pineapple), new Fruit("Strawberry", R.drawable.strawberry),
new Fruit("Cherry", R.drawable.cherry), new Fruit("Mango", R.drawable.mango)};
//裝載水果的鏈表
//爲什麼有了數組還要定義List:因爲我們要顯示的水果數據個數不確定,使用多少個就往List中裝多少水果數據
//水果數組只是裝填水果信息的模具,具體使用數據還是使用List
private List<Fruit> fruitList = new ArrayList<>();
private FruitAdapter adapter; //適配器
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...
initFruits(); //初始化水果數據
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
//使用GridLayoutManger佈局,設置每行顯示2列數據
GridLayoutManager layoutManager = new GridLayoutManager(this, 2);
recyclerView.setLayoutManager(layoutManager);
//創建適配器
adapter = new FruitAdapter(fruitList);
//綁定RecyclerView
recyclerView.setAdapter(adapter);
}
//初始化水果數據
private void initFruits() {
//清空水果列表的數據
fruitList.clear();
//向List中裝填50個水果數據
for (int i = 0; i < 50; i++) {
Random random = new Random();
//從水果數組中隨機一個不超過水果數組長度的整數
int index = random.nextInt(fruits.length);
//將隨機出來的水果數據裝到水果List中
fruitList.add(fruits[index]);
}
}
...
}
運行程序:
效果很不錯,但是Toolbar被蓋住了。
原因:我們使用的最外層佈局是CoordinatorLayout,他是一個加強版的FrameLayout,FrameLayout在其控件不指定位置時,都默認放在左上角。RecyclerView和Toolbar都是放在該佈局中,沒有指定位置。自然就產生了這種現象。
解決:解決方法可以是採用傳統方法,把RecyclerView向下偏移一個Toolbar的高度。CoordinatorLayout佈局不是普通的FrameLayout,它有更巧妙的解決方法。
2、使用AppBarLayout
APPBarLayout由Design Support庫提供。它實際上是一個垂直方向的LinearLayout,並且在內部做了很多滾動事件的封裝,應用了一些Material Design的設計理念。
使用AppBarLayout解決上面出現的問題只需要兩步:
①、把Toolbar嵌套到AppBarLayout中。
②、爲RecyclerView指定一個佈局行爲。
修改activity_main.xml的代碼:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
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.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
...
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
...
</android.support.design.widget.CoordinatorLayout>
...
</android.support.v4.widget.DrawerLayout>
只需要幾行代碼就可以完成。爲RecyclerView添加的佈局行爲是:
app:layout_behavior="@string/appbar_scrolling_view_behavior"
它可以把滾動事件發送給它外層的AppBarLayout佈局。
運行程序:
已經可以解決Toolbar被遮蓋的問題了。
當RecyclerView滾動時,會將滾動事件通知給AppBarLayout,上述代碼中並沒有進行處理。
當AppBarLayout收到滾動事件時,它內部的子控件可以指定如何去相應這些事件。
修改activity_main.xml代碼,在Toolbar代碼塊後面加上一條語句即可:
<android.support.v7.widget.Toolbar
...
app:layout_scrollFlags="scroll|enterAlways|snap" />
它的作用是指定Toolbar響應RecyclerView滾動事件的方法。其中:
scroll:當RecyclerView向上滾動時,Toolbar會跟着一起向上滾動並實現隱藏。
enterAlways:當RecyclerView向下滾動時,Toolbar會跟着一起向下滾動並重新顯示。
snap:當Toolbar還沒有完全隱藏或顯示的時候,Toolbar會根據當前滾動的距離,自動選擇隱藏還是顯示。
運行結果:
五、使用SwipeRefreshLayout實現下拉刷新
SwipeRefreshLayout由Support-v4庫提供,使用時,把需要實現下拉刷新的控件放到SwipeRefreshLayout中就可以了,本文所述就是將RecyclerView放到SwipeRefreshLayout中。
修改activity_main.xml文件:
<android.support.v4.widget.SwipeRefreshLayout
android:id="@+id/swipe_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.SwipeRefreshLayout>
剛剛爲了解決Toolbar被覆蓋的問題,爲Toolbar嵌套了一層AppBarLayout,併爲RecyclerView添加了一個佈局行爲,這個滾動行爲會把滾動事件發送給它的外層AppBarLayout。現在需要把它挪到SwipRefreshLayout中,否則滾動事件發送不到AppBarLayout。若它的位置不動,則Toolbar還是會被遮蓋。只需要記住它是追隨AppBarLayout的就可以了。
修改MainActivity的代碼:
public class MainActivity extends AppCompatActivity {
...
private SwipeRefreshLayout swipeRefreshLayout; //下拉刷新佈局,用於實現下拉刷新
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...
swipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.swipe_refresh);
//設置下拉刷新時的進度條顏色
swipeRefreshLayout.setColorSchemeResources(R.color.colorPrimary);
//觸發下拉刷新的事件
swipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
//刷新水果圖片
refreshFruits();
}
});
}
//刷新顯示的水果圖片
private void refreshFruits() {
//刷新操作一般是從網絡上獲取數據,需要開啓線程,這裏採用的是本地刷新
new Thread(new Runnable() {
@Override
public void run() {
try {
//使線程睡眠2s,因爲本地刷新速度太快,不設置睡眠容易看不到刷新進度條
Thread.sleep(2000);
} catch (InterruptedException e) {
e.printStackTrace();
}
//從主線程更新UI
runOnUiThread(new Runnable() {
@Override
public void run() {
//再次初始化水果數據,因爲每次初始化的水果數據都是不同的
initFruits();
//通知FruitAdapter的適配器,數據發生了變化
adapter.notifyDataSetChanged();
//表示刷新事件結束,隱藏刷新進度條,若無此語句,進度條一直存在。
swipeRefreshLayout.setRefreshing(false);
}
});
}
}).start(); //不要忘記啓動線程
}
...
}
運行程序:
六、使用CollapsingToolbarLayout實現可摺疊式標題欄
看到CollapsingToolbarLayout這個名字就能夠想到,它是一個和Toolbar相關的佈局。它由Design Support庫提供,作用於Toolbar之上,它可以讓Toolbar的效果更加豐富,實現非常華麗的效果。
注意:CollapsingToolbarLayout並不是獨立存在的,它被限定只能作爲AppBarLayout的直接子佈局,而AppBarLayout又必須是CoordinatorLayout的子佈局。
需求:用一個額外的活動來展示水果詳情頁面,實現標題欄可摺疊,內容包括標題欄、水果圖片、水果內容詳情和懸浮按鈕。
新建一個Empty活動,指定活動名爲FruitActivity,指定佈局名爲activity_fruit.xml。
活動佈局主要分爲兩部分,一個是水果標題欄,一個是水果內容詳情。分步驟來實現:
1、實現標題欄部分
(1)、使用CoordinatorLayout作爲最外層佈局
<?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.CoordinatorLayout>
(2)、在CoordinatorLayout中嵌套一個AppBarLayout佈局
<?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:id="@+id/appBar"
android:layout_width="match_parent"
android:layout_height="250dp">
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
定義了AppBarLayout的高度爲250dp,這個高度是一會標題欄展開後圖片的顯示高度。
(3)、在AppBarLayout中嵌套一個CollapsingToolbarLayout佈局
<?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:id="@+id/appBar"
android:layout_width="match_parent"
android:layout_height="250dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
CollapsingToolbarLayout佈局中:
theme屬性:用於設置主題,在MainActivity的Toolbar就是這個主題,現在把這個主題提到上一級來。app:contentScrim屬性:用於指定CoordinatorLayout在趨於摺疊以及摺疊之後的背景色,CoordinatorLayout摺疊之後就是一個普通的Toolbar,所以指定顏色爲colorPrimary。
app:layout_scrollflags屬性:
scroll表示CollapsingToolbarLayout會隨着水果內容詳情的滾動一起滾動。
exitUntilCollapsed表示當CollapsingToolbarLayout隨滾動完成摺疊後就保留在界面上,不再移出屏幕。
(4)、在CollapsingToolbarLayout中定義具體內容
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="@+id/fruit_image_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
app:layout_collapseMode屬性:用於指定當前控件在CollapsingToolbarLayout摺疊過程中的摺疊模式。
Toolbar被指定成pin:表示摺疊的過程中,Toolbar的位置始終保持不變。
ImageView被指定成parallax:表示會在摺疊的過程中產生一定的錯位偏移,即產生一定的視覺效果。
2、實現水果內容詳情部分
(1)、在最外層使用NestedScrollView佈局。
NestedScrollView由Support-v4庫提供。像ScrollView一樣,它支持使用滾動的方式來查看屏幕以外的數據,而NestedScrollView在此基礎上還增加了嵌套相應滾動事件的功能。由於CoordinatorLayout本身已經可以響應滾動事件了,所以在它的內部就需要使用NestedScrollView或RecyclerView這樣的佈局。
NestedScrollView與AppBarLayout是平級的。在AppBarLayout下使用NestedScrollView標籤:
<?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:id="@+id/appBar"
android:layout_width="match_parent"
android:layout_height="250dp">
...
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
通過app:behavior屬性指定了一個佈局行爲,和之前在RecyclerView中的用法一樣,不會遮蓋到標題欄。
注:不論是ScrollView還是NestedScrollView,它們的內部都只允許存在一個直接子佈局,所以,想要在裏面放很多東西的話通常會先嵌套一個LinearLayout佈局,在LinearLayout佈局中放入具體內容。
(2)、設置NestedScrollView裏的具體內容
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="35dp"
app:cardCornerRadius="4dp">
<TextView
android:id="@+id/fruit_content_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp" />
</android.support.v7.widget.CardView>
</LinearLayout>
3、加入懸浮按鈕
<?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.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
...
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:src="@drawable/ic_comment"
app:layout_anchor="@id/appBar"
app:layout_anchorGravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>
通過app:layout_anchor屬性爲懸浮按鈕設置了一個錨點,並將它的位置設置爲右下角。這樣懸浮按鈕就會出現在展開後的標題欄中,且跟隨着標題欄移動。
4、佈局編寫完畢,開始編寫邏輯功能。
修改FruitActivity中的代碼:
package com.my.materialdesigntest;
import android.content.Intent;
import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.widget.ImageView;
import android.widget.TextView;
import com.bumptech.glide.Glide;
public class FruitActivity extends AppCompatActivity {
//水果名字段
public static final String FRUIT_NAME = "fruit_name";
//水果圖片資源ID字段
public static final String FRUIT_IMAGE_ID = "fruit_image_id";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_fruit);
//獲取啓動本活動時傳遞過來的數據,沒有數據就無法知道用戶想要查看的水果數據是什麼
Intent intent = getIntent();
//取出數據
String fruitName = intent.getStringExtra(FRUIT_NAME);
int fruitImageId = intent.getIntExtra(FRUIT_IMAGE_ID, 0);
//關聯控件
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
ImageView fruitImageView = (ImageView) findViewById(R.id.fruit_image_view);
TextView fruitContentText = (TextView) findViewById(R.id.fruit_content_text);
//使用Toolbar
setSupportActionBar(toolbar);
//獲取ActionBar實例,具體由Toolbar實現
ActionBar actionBar = getSupportActionBar();
//此時顯示返回按鈕
if (actionBar != null) {
actionBar.setDisplayHomeAsUpEnabled(true);
}
//設置標題
collapsingToolbar.setTitle(fruitName);
//加載圖片
Glide.with(this).load(fruitImageId).into(fruitImageView);
//通過generateFruitContent方法獲取一段水果內容信息
String fruitContent = generateFruitContent(fruitName);
//將獲取到的信息設置到控件上
fruitContentText.setText(fruitContent);
}
//通過水果名獲取一段水果信息
private String generateFruitContent(String fruitName) {
//字符串緩衝區
StringBuilder fruitContent = new StringBuilder();
//將水果名拼接500次
for (int i = 0; i < 500; i++) {
fruitContent.append(fruitName);
}
return fruitContent.toString();
}
//重寫的標題欄返回按鈕的點擊事件,結束活動。即返回主活動
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case android.R.id.home:
finish();
return true;
}
return super.onOptionsItemSelected(item);
}
}
5、設置RecyclerView的點擊事件。
不設置點擊事件,自然沒有辦法進入到FruitActivity中。修改FruitAdapter的代碼:
public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {
...
//必須重寫的第一個方法:創建ViewHolder方法
@Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
...
final ViewHolder holder = new ViewHolder(view);
//設置CardView的點擊事件
holder.cardView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
//獲取點擊項的位置
int position = holder.getAdapterPosition();
//獲取水果實例
Fruit fruit = mFruitList.get(position);
//啓動FruitActivity,放入水果的名稱、資源ID信息
Intent intent = new Intent(mContext, FruitActivity.class);
intent.putExtra(FruitActivity.FRUIT_NAME, fruit.getName());
intent.putExtra(FruitActivity.FRUIT_IMAGE_ID, fruit.getImageId());
mContext.startActivity(intent);
}
});
return holder;
}
...
}
運行程序:
篇幅太長了,最後的部分轉到下一篇。地址:Android學習筆記:界面設計Material Design的基本使用方法(三)
相關文章:Android學習筆記:界面設計Material Design的基本使用方法(一)
本文總結參考自郭神(郭霖)的《第一行代碼 第2版》