前幾天看到這樣一個(gè)UI效果,然后自己也仿照實(shí)現(xiàn)了下:
開眼app個(gè)人中心.gif
看著挺酷的,也有很多App都用到了這個(gè)UI效果,比如開眼App和滬江開心詞場(chǎng)就用到了.
所以下面就來簡(jiǎn)單實(shí)現(xiàn)一下這個(gè)UI效果吧.
組合三劍客
1.AppBarLayout
2.CoordinatorLayout
3.CollapsingToolbarLayout
實(shí)現(xiàn)上面的UI效果需要將這三劍客的組合起來用,下面先介紹下這三個(gè)控件:
AppBarLayout:
1.AppBarLayout簡(jiǎn)單介紹
AppBarLayout是android.support:design包中的支持的控件,繼承自LinearLayout,實(shí)際上就是一個(gè)垂直分布的LinearLayout.父類視圖結(jié)構(gòu)如下:
public class AppBarLayout
extends LinearLayout
java.lang.Object
? android.view.View
? android.view.ViewGroup
? android.widget.LinearLayout
? android.support.design.widget.AppBarLayout
其中官方文檔中有這么兩句話尤為重要:
This view depends heavily on being used as a direct child within a
CoordinatorLayout. If you use AppBarLayout within a differentViewGroup, most of it's functionality will not work.
AppBarLayoutalso requires a separate scrolling sibling in order to know when to scroll. The binding is done through theAppBarLayout.ScrollingViewBehaviorbehavior class, meaning that you should set your scrolling view's behavior to be an instance ofAppBarLayout.ScrollingViewBehavior.
意思就是說AppBarLayout 必須作為CoordinatorLayout的直接子類,否則很多功能是無法實(shí)現(xiàn)的.并且AppBarLayout 必須有一個(gè)能滾動(dòng)的兄第ScrollView (實(shí)現(xiàn)了NestedScrollView,listview不可以哦),以此來通知AppBarLayout 何時(shí)進(jìn)行滾動(dòng),兄弟View必須實(shí)現(xiàn)以下標(biāo)識(shí):
app:layout_behavior="@string/appbar_scrolling_view_behavior"
官方給出的例子如下:
<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">
<!-- Your scrolling content -->
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<android.support.v7.widget.Toolbar
...
app:layout_scrollFlags="scroll|enterAlways"/>
<android.support.design.widget.TabLayout
...
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
2.AppBarLayout的具體使用
- AppBarLayout直接子View的幾種響應(yīng)方式
AppbarLayout 可以指定當(dāng)某個(gè)可滑動(dòng)的兄弟View滑動(dòng)手勢(shì)改變時(shí)AppbarLayout 內(nèi)部直接子View的響應(yīng)動(dòng)作,只要通過
app:layout_scrollFlags屬性來指定響應(yīng)動(dòng)作,layout_scrollFlags有5種響應(yīng)動(dòng)作,下面簡(jiǎn)單介紹下:
- app:layout_scrollFlags="scroll"
當(dāng)子view設(shè)置響應(yīng)動(dòng)作為app:layout_scrollFlags="scroll"時(shí),子view會(huì)隨ScrollView 的滾動(dòng)而滾動(dòng),就相當(dāng)于這時(shí)的子view變成了ScrollView 的item了,會(huì)跟隨item一起滾動(dòng).
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:title="AppbarLayout"
app:titleTextColor="@color/white"
app:layout_scrollFlags="scroll"
>
</android.support.v7.widget.Toolbar>
- app:layout_scrollFlags="scroll|enterAlways"
當(dāng)子view設(shè)置響應(yīng)動(dòng)作為app:layout_scrollFlags="scroll|enterAlways"時(shí),當(dāng)ScrollView 向下滑動(dòng)時(shí)，子View 將直接向下滑動(dòng)拧篮，而不管ScrollView 是否在滑動(dòng)词渤。
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:title="AppbarLayout"
app:titleTextColor="@color/white"
app:layout_scrollFlags="scroll|enterAlways"
/>
3.app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
當(dāng)子view設(shè)置響應(yīng)動(dòng)作為app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"時(shí),
當(dāng)ScrollView 向下滑動(dòng)的時(shí)候，子View（設(shè)置了enterAlwaysCollapsed 的子View）下滑至折疊的高度他托，當(dāng)ScrollView 到達(dá)滑動(dòng)范圍的結(jié)束值的時(shí)候掖肋，滑動(dòng)View剩下的部分開始滑動(dòng)仆葡。這個(gè)折疊的高度是通過子View的minimum height （最小高度）指定的赏参。
簡(jiǎn)單來說,就是第二種的加強(qiáng)版,當(dāng)ScrollView 向下滑動(dòng)時(shí)候,子view先露出半個(gè)頭,當(dāng)ScrollView 下滑到頂時(shí),子view的頭就全露出來了.
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="200dp"
android:minHeight="?attr/actionBarSize"
app:title="AppbarLayout"
android:gravity="bottom"
android:layout_marginBottom="25dp"
app:titleTextColor="@color/white"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
/>
4.app:layout_scrollFlags="scroll|exitUntilCollapsed"
當(dāng)子view設(shè)置響應(yīng)動(dòng)作為app:layout_scrollFlags="scroll|exitUntilCollapsed"時(shí),
當(dāng)ScrollView 向上滑動(dòng)時(shí)，子View先響應(yīng)滑動(dòng)事件沿盅，滑動(dòng)至折疊高度把篓，也就是通過minimum height 設(shè)置的最小高度后，就固定不動(dòng)了腰涧，再把滑動(dòng)事件交給 scrollview,然后 scrollview才開始滑動(dòng)韧掩。
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="200dp"
android:minHeight="?attr/actionBarSize"
app:title="AppbarLayout"
android:gravity="bottom"
app:titleTextColor="@color/white"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
/>
- app:layout_scrollFlags="scroll|snap"
當(dāng)子view設(shè)置響應(yīng)動(dòng)作為app:layout_scrollFlags="scroll|snap"時(shí),當(dāng)ScrollView 下滑到頂部時(shí),如果子view只露出30%的話,子view就會(huì)自動(dòng)折疊回去,如果露出60%的話,就會(huì)自動(dòng)展開.
簡(jiǎn)單來說,就是具有彈性且遵守就近原則,露的小就干脆不露頭了,露的大,就全部出來了.
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="200dp"
android:minHeight="?attr/actionBarSize"
app:title="AppbarLayout"
android:gravity="bottom"
app:titleTextColor="@color/white"
app:layout_scrollFlags="scroll|snap"
/>
CoordinatorLayout
CoordinatorLayout 用來調(diào)節(jié)和控制子View的滾動(dòng)，而這些子View 的具體響應(yīng)動(dòng)作是通過 behavior 屬性來指定的,你也可以根據(jù)需求自定義自己的behavior, 簡(jiǎn)單使用如下:,
<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" >
<!-- 使用此屬性指定響應(yīng) -->
<!-- Your scrolling content -->
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
app:layout_behavior="@string/appbar_scrolling_view_behavior" >
<!-- 使用此屬性指定響應(yīng) -->
CollapsingToolbarLayout:
CollapsingToolbarLayout也是android.support:design包中的支持的控件,繼承自FrameLayout.主要用于實(shí)現(xiàn)ToolBar的伸縮效果,而且必須為AppBarLayout的直接子View;
繼承結(jié)構(gòu)圖如下:
java.lang.Object
? android.view.View
? android.view.ViewGroup
? android.widget.FrameLayout
? android.support.design.widget.CollapsingToolbarLayout
主要使用到的方法如下:
- setCollapsedTitleGravity
void setCollapsedTitleGravity（int gravity）
設(shè)置折疊標(biāo)題和垂直重力的水平對(duì)齊方式窖铡，當(dāng)折疊邊界中有額外空間超出標(biāo)題本身所需的空間時(shí)疗锐，將使用該對(duì)齊方式
相關(guān)的XML屬性：
CollapsingToolbarLayout_collapsedTitleGravity
2.setExpandedTitleGravity
void setExpandedTitleGravity（int gravity）
設(shè)置展開標(biāo)題和垂直重力的水平對(duì)齊方式，當(dāng)擴(kuò)展邊界中有額外空間超出標(biāo)題本身所需的空間時(shí)费彼，將使用該對(duì)齊方式滑臊。
相關(guān)的XML屬性：
CollapsingToolbarLayout_expandedTitleGravity
3.setExpandedTitleTextColor
void setExpandedTitleTextColor（ColorStateList colors）
設(shè)置展開標(biāo)題的文本顏色。
4.setCollapsedTitleTextColor
void setCollapsedTitleTextColor（ColorStateList colors）
設(shè)置折疊標(biāo)題的文本顏色箍铲。
5.setCollapsedTitleTypeface
void setCollapsedTitleTypeface（字體字體）
設(shè)置用于折疊標(biāo)題的字體雇卷。
5.setExpandedTitleMarginBottom
void setExpandedTitleMarginBottom（int margin）
以像素為單位設(shè)置底部展開的標(biāo)題邊距。
相關(guān)的XML屬性：
CollapsingToolbarLayout_expandedTitleMarginBottom
- 固定Toolbar
app:layout_collapseMode="pin"
6.更多方法見文檔
關(guān)于AppBarLayout的三劍客組合就介紹的差不多了,想進(jìn)一步了解的可以去查閱官方文檔,上面都給出了連接的.
特別說明:
三劍客配合使用，可以做出一些很炫酷的UI效果.
但是前提必須滿足:AppbarLayout 要作為CoordinatorLayout 的直接子View关划，而CollapsingToolbarLayout 要作為AppbarLayout 的直接子View 小染，否則，上面展示的效果將實(shí)現(xiàn)不了.
AppbarLayout實(shí)例展示
1.仿 [開眼App]個(gè)人中心效果
- .xml布局文件:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:fresco="http://schemas.android.com/apk/res-auto"
xmlns:imagetext="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:background="@color/colorWhite"
>
<android.support.design.widget.AppBarLayout
android:id="@+id/center_appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
android:background="@color/colorWhite"
android:fitsSystemWindows="true"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/collapsing_toobar"
android:layout_width="match_parent"
android:layout_height="260dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="@color/colorGraylight"
fresco:expandedTitleTextAppearance="@style/style_textsize1"
fresco:collapsedTitleTextAppearance="@style/style_textsize"
fresco:collapsedTitleGravity="left"
fresco:expandedTitleMarginTop="185dp"
fresco:expandedTitleGravity="left"
fresco:expandedTitleMarginStart="30dp"
>
<FrameLayout
app:layout_scrollFlags="scroll"
android:layout_width="match_parent"
android:layout_height="180dp">
<com.facebook.drawee.view.SimpleDraweeView
android:id="@+id/avatar_max"
android:layout_width="match_parent"
android:layout_height="170dp" />
<com.facebook.drawee.view.SimpleDraweeView
android:layout_marginLeft="20dp"
android:layout_gravity="bottom"
android:id="@+id/avatar_min"
android:layout_width="70dp"
android:layout_height="70dp"
fresco:actualImageScaleType="centerCrop"
fresco:placeholderImageScaleType="centerCrop"
fresco:roundedCornerRadius="50dp"
/>
</FrameLayout>
<FrameLayout
android:layout_marginTop="180dp"
app:layout_scrollFlags="scroll"
android:layout_width="match_parent"
android:layout_height="50dp"
>
<Button
android:id="@+id/edit_btn"
android:layout_width="60dp"
android:layout_height="20dp"
android:layout_marginRight="20dp"
android:layout_gravity="right|center_vertical"
android:background="@drawable/login_btn"
android:gravity="center"
android:text="編輯資料"
android:textColor="@color/colorBlacklight"
android:textSize="10sp" />
</FrameLayout>
<TextView
android:layout_marginTop="230dp"
app:layout_scrollFlags="scroll"
android:textSize="10sp"
android:id="@+id/date"
android:layout_marginLeft="20dp"
android:text="2018.07.08注冊(cè)"
android:textColor="@color/colorGraylight"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
android:layout_height="?attr/actionBarSize"
>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<LinearLayout
android:gravity="center_vertical"
android:layout_marginTop="20dp"
android:background="@color/colorGrayalpha"
android:layout_width="match_parent"
android:layout_height="70dp">
<openeyes.dr.openeyes.widget.CustomImageTextView
android:id="@+id/works"
android:layout_marginLeft="40dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
imagetext:image="@drawable/works2"
imagetext:text="@string/works"
imagetext:textColor="@color/colorGraylight"
>
</openeyes.dr.openeyes.widget.CustomImageTextView>
<openeyes.dr.openeyes.widget.CustomImageTextView
android:id="@+id/attention"
android:layout_marginLeft="90dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
imagetext:image="@drawable/attention6"
imagetext:text="@string/attention"
imagetext:textColor="@color/colorGraylight"
>
</openeyes.dr.openeyes.widget.CustomImageTextView>
<openeyes.dr.openeyes.widget.CustomImageTextView
android:id="@+id/fans"
android:layout_marginLeft="90dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
imagetext:image="@drawable/works2"
imagetext:text="@string/fans"
imagetext:textColor="@color/colorGraylight"
>
</openeyes.dr.openeyes.widget.CustomImageTextView>
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recycle_state"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
- java文件:
/**
* Created by darryrzhong on 2018/9/5.
*/
public class PersonPageActivity extends SwipeBackActivity {
@BindView(R.id.avatar_max)
SimpleDraweeView avatarBackground;
@BindView(R.id.avatar_min)
SimpleDraweeView avatarUser;
@BindView(R.id.date)
TextView registerDate;
@BindView(R.id.works)
CustomImageTextView works;
@BindView(R.id.attention)
CustomImageTextView attention;
@BindView(R.id.fans)
CustomImageTextView fans;
@BindView(R.id.center_appbar_layout)
AppBarLayout appBarLayout;
@BindView(R.id.collapsing_toobar)
CollapsingToolbarLayout collToobar;
@BindView(R.id.toolbar)
Toolbar toolbar;
@BindView(R.id.recycle_state)
RecyclerView recyclerView;
private SharedPreferences sharedPreferences = MyApplication.sharedPreferences;
private HistoryDB db;
private List<HistoryDetails> details = null;
private DynamicStateRecyclerAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_person_page);
ButterKnife.bind(this);
initView();
initData();
}
private void initData() {
db = new HistoryDB();
details= db.loadHistoryByUserId(sharedPreferences.getString("userId","000"));
if (details==null||details.size()==0){
}else {
Collections.reverse(details);
adapter = new DynamicStateRecyclerAdapter(details,this);
LinearLayoutManager manager = new LinearLayoutManager(this);
manager.setOrientation(LinearLayoutManager.VERTICAL);
recyclerView.setLayoutManager(manager);
recyclerView.setAdapter(adapter);
recyclerView.setItemAnimator(new DefaultItemAnimator());//添加默認(rèn)動(dòng)畫
//設(shè)置RecyclerView的item監(jiān)聽事件
setOnItemClickListener();
}
}
private void setOnItemClickListener() {
adapter.setOnItemClickListener(new DynamicStateRecyclerAdapter.OnItemClickListener() {
@Override
public void onItemClick(View itemview, DynamicStateRecyclerAdapter.MyViewHolder childview, int position) {
initVideoDetail( position);//初始化視頻詳情界面數(shù)據(jù)并實(shí)現(xiàn)跳轉(zhuǎn)
}
});
}
/**
* 初始化視頻詳情界面數(shù)據(jù),跳轉(zhuǎn)至視頻詳情界面
* */
private void initVideoDetail(int position) {
Intent intent = new Intent(PersonPageActivity.this, VideoDetailActivity.class);
Bundle bundle = new Bundle();
bundle.putString("title",details.get(position).getTitle());//獲取標(biāo)題
bundle.putString("time", details.get(position).getDetail());
bundle.putString("desc", details.get(position).getDesc());//視頻描述
bundle.putString("blurred", details.get(position).getBlurred());//模糊圖片地址
bundle.putString("feed", details.get(position).getPhoto());//圖片地址
bundle.putString("video", details.get(position).getVideo());//視頻播放地址
bundle.putInt("collect", details.get(position).getCollect());//收藏量
bundle.putInt("share", details.get(position).getShare());//分享量
bundle.putInt("reply", details.get(position).getReply());//回復(fù)數(shù)量
intent.putExtras(bundle);
startActivity(intent);
}
private void initView() {
avatarBackground.setImageURI(Uri.parse(sharedPreferences.getString("userIcon","")));
avatarUser.setImageURI(Uri.parse(sharedPreferences.getString("userIcon","")));
toolbar.setTitle(sharedPreferences.getString("userName",""));//設(shè)置標(biāo)題
collToobar.setExpandedTitleColor(getResources().getColor(R.color.colorBlack));
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowHomeEnabled(true);
toolbar.setNavigationIcon(R.drawable.back_black);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
finish();
}
});
}
@OnClick(R.id.attention)
public void onClick(){
startActivity(new Intent(this,MyAttentionActivity.class));
}
}
效果展示:
開眼app個(gè)人中心.gif
2.仿[開眼App]搜索懸停界面:
- .xml布局文件:
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp">
<openeyes.dr.openeyes.widget.SearchEditText
android:id="@+id/search_editext"
android:layout_marginLeft="20dp"
android:background="@drawable/shape_search"
android:layout_width="300dp"
android:layout_height="30dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:gravity="start|center_vertical"
android:imeOptions="actionSearch"
android:singleLine="true"
android:hint="搜索視頻贮折、作者裤翩、用戶及標(biāo)簽"
android:textSize="13sp"
/>
<TextView
android:id="@+id/cancle_main"
android:textColor="@color/colorBlacklight"
android:gravity="center"
android:text="取消"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<FrameLayout
android:id="@+id/history_fl"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="50dp"
>
<TextView
android:layout_gravity="center_vertical"
android:layout_marginLeft="20dp"
android:textSize="20sp"
android:text="搜索歷史"
android:textColor="@color/colorBlack"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/delete_history"
android:layout_marginRight="20dp"
android:layout_gravity="center_vertical|right"
android:textColor="@color/colorAniBtns"
android:gravity="center"
android:text="清空"
android:textSize="13sp"
android:layout_width="50dp"
android:layout_height="wrap_content" />
</FrameLayout>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@color/colorWhite"
>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorWhite"
>
<android.support.v7.widget.RecyclerView
android:id="@+id/search_history_rv"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll"
>
</android.support.v7.widget.RecyclerView>
<TextView
android:layout_marginLeft="20dp"
android:text="熱搜關(guān)鍵詞"
android:textSize="20sp"
android:textColor="@color/colorBlack"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/hot_search_rv"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
>
</android.support.v7.widget.RecyclerView>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
- java文件:
package openeyes.dr.openeyes.view.activity;
/**
* Created by darryrzhong on 2018/9/10.
*/
public class SearchActivity extends AppCompatActivity {
@BindView(R.id.search_editext)
SearchEditText searchEditText;
@BindView(R.id.cancle_main)
TextView cancleMain;
@BindView(R.id.history_fl)
FrameLayout hintLayout;
@BindView(R.id.delete_history)
TextView deleteHistory;
@BindView(R.id.search_history_rv)
RecyclerView recyclerSearch;
@BindView(R.id.hot_search_rv)
RecyclerView recyclerHot;
private String [] hotKeyWord = {"美食","旅行","生活小技巧","健身","汽車","廣告","動(dòng)畫",
"創(chuàng)意靈感","當(dāng)下亂碼","一條","日食記","視知TV"};
private List<SearchHistory> searchHistories;
private List<SearchHistory> hotKeyWords = new ArrayList<>();;
private SearchRecyclerAdapter adapter;
private SearchDB db;
private SearchRecyclerAdapter adapter1;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_search);
ButterKnife.bind(this);
initData();
setListener();
}
private void initData() {
db = new SearchDB();
hotKeyWords.clear();
for (String keyWord:hotKeyWord){
hotKeyWords.add(new SearchHistory(keyWord));
}
LinearLayoutManager manager = new LinearLayoutManager(this);
manager.setOrientation(LinearLayout.VERTICAL);
recyclerHot.setLayoutManager(manager);
adapter = new SearchRecyclerAdapter(hotKeyWords);
recyclerHot.setAdapter(adapter);
recyclerHot.setItemAnimator(new DefaultItemAnimator());
searchHistories = db.loadSearchHistoryAll();
if (searchHistories==null||searchHistories.size()==0){
hintLayout.setVisibility(View.GONE);
recyclerSearch.setVisibility(View.GONE);
}else {
hintLayout.setVisibility(View.VISIBLE);
Collections.reverse(searchHistories);
LinearLayoutManager manager1 = new LinearLayoutManager(this);
manager.setOrientation(LinearLayout.VERTICAL);
recyclerSearch.setLayoutManager(manager1);
adapter1 = new SearchRecyclerAdapter(searchHistories);
recyclerSearch.setAdapter(adapter1);
recyclerSearch.setItemAnimator(new DefaultItemAnimator());//添加默認(rèn)動(dòng)畫
adapter1.setOnItemClickListener(new SearchRecyclerAdapter.OnItemClickListener() {
@Override
public void onItemClick(View itemview, SearchRecyclerAdapter.MyViewHolder childview, int position) {
Intent intent = new Intent(SearchActivity.this,SearchResultActivity.class);
Bundle bundle = new Bundle();
bundle.putString("keyWord",searchHistories.get(position).getKeyWord());
intent.putExtras(bundle);
startActivity(intent);
}
});
}
}
private void setListener() {
searchEditText.setOnKeyListener(new View.OnKeyListener() {
@Override
public boolean onKey(View view, int keyCode, KeyEvent keyEvent) {
if (keyCode==KeyEvent.KEYCODE_ENTER&&keyEvent.getAction()==KeyEvent.ACTION_DOWN){
String keyWord = searchEditText.getText().toString().trim();
if ("".equals(keyWord)){
ToastUtil.showToast(SearchActivity.this,"請(qǐng)輸入搜索內(nèi)容");
}else {
SearchHistory searchHistory = new SearchHistory(keyWord);
List<SearchHistory> temp = db.loadSearchByKeyWord(keyWord);
if (temp==null){
db.saveOrUpdate(searchHistory);
}else if (temp.size()==0){
db.saveOrUpdate(searchHistory);
}
Intent intent = new Intent(SearchActivity.this,SearchResultActivity.class);
Bundle bundle = new Bundle();
bundle.putString("keyWord",keyWord);
intent.putExtras(bundle);
startActivity(intent);
}
}
return false;
}
});
adapter.setOnItemClickListener(new SearchRecyclerAdapter.OnItemClickListener() {
@Override
public void onItemClick(View itemview, SearchRecyclerAdapter.MyViewHolder childview, int position) {
Intent intent = new Intent(SearchActivity.this,SearchResultActivity.class);
Bundle bundle = new Bundle();
bundle.putString("keyWord",hotKeyWords.get(position).getKeyWord());
intent.putExtras(bundle);
startActivity(intent);
}
});
}
@OnClick({R.id.cancle_main,R.id.delete_history,R.id.search_editext})
public void onClick(View v){
switch (v.getId()){
case R.id.cancle_main:
finish();
break;
case R.id.delete_history:
try {
db.delTable();
} catch (DbException e) {
e.printStackTrace();
}
initData();
break;
case R.id.search_editext:
break;
}
}
@Override
protected void onResume() {
super.onResume();
initData();
}
}
效果展示:
開眼app搜索記錄.gif
好了,到這里關(guān)于AppBarLayout三劍客的基本使用就介紹完了,使用三劍客能夠?qū)崿F(xiàn)許多炫酷的UI效果,感興趣的朋友可以自行自定義.
歡迎關(guān)注作者darryrzhong,更多干貨等你來拿喲.
請(qǐng)賞個(gè)小紅心！因?yàn)槟愕墓膭?lì)是我寫作的最大動(dòng)力调榄！
更多精彩文章請(qǐng)關(guān)注
