FadingActionBar这个开源项目在社区上很火,感觉Google I/O 2014中就有它的身影。今天我们来介绍下这个实用的开源项目。
首先是到这里(https://github.com/ManuelPeinado/FadingActionBar)下载项目的包。解压后导入library。这里我推荐选择library+compat的包作为library。因为用夏洛克的话还得导入夏洛克。现在既然Google官方的v7中就支持了actionbar,那么咱们就顺应历史潮流吧。
然后是在工程中应用这个compat的library,并且建立主题样式。
styles( 没什么可说的,就是在继承后设置actionbar为全透明)
<?xml version="1.0" encoding="utf-8"?> <resources> <style name="Widget" /> <style name="Widget.ActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid.Inverse"> </style> <style name="Widget.Light" /> <style name="Widget.Light.ActionBar" parent="@style/Widget.AppCompat.Light.ActionBar.Solid"> </style> <style name="Widget.ActionBar.Transparent"> <item name="android:background">@android:color/transparent</item> <item name="background">@android:color/transparent</item> </style> <style name="Widget.Light.ActionBar.Transparent"> <item name="android:background">@android:color/transparent</item> <item name="background">@android:color/transparent</item> </style> </resources>
themes(设置一黑一白两个主题风格,可自己根据需要来选择)
<resources xmlns:tools="http://schemas.android.com/tools" tools:ignore="NewApi"> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <item name="android:actionBarStyle">@style/Widget.ActionBar</item> <item name="actionBarStyle">@style/Widget.ActionBar</item> </style> <style name="AppTheme.TranslucentActionBar"> <!-- 设置透明风格 --> <item name="android:actionBarStyle">@style/Widget.ActionBar.Transparent</item> <!-- 设置悬浮风格 --> <item name="android:windowActionBarOverlay">true</item> <!-- 设置actionbar的风格 --> <item name="actionBarStyle">@style/Widget.ActionBar.Transparent</item> <item name="windowActionBarOverlay">true</item> <item name="android:windowContentOverlay">@null</item> </style> <style name="AppTheme.Light.TranslucentActionBar" parent="Theme.AppCompat.Light"> <item name="android:actionBarStyle">@style/Widget.Light.ActionBar.Transparent</item> <item name="android:windowActionBarOverlay">true</item> <item name="actionBarStyle">@style/Widget.Light.ActionBar.Transparent</item> <item name="windowActionBarOverlay">true</item> <item name="android:windowContentOverlay">@null</item> </style> </resources>
最后记得要在manifest中设置这个主题哦~
<application android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" >
ok,准备工作做好了,现在咱们开始使用它了。我下面就讲解两个十分常用的情况,一种是把它放在listview中,一种是放在scrollview中。
1.listview+fadingactionbar
建立布局文件,这里就简单的写一个listview
activity_listview.xml
<ListView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@android:id/list" android:cacheColorHint="@android:color/transparent" android:layout_width="match_parent" android:layout_height="match_parent" />
ListViewActivity
/* * Copyright (C) 2013 Manuel Peinado * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package com.manuelpeinado.fadingactionbar.samples.actionbarcompat; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStream; import java.io.InputStreamReader; import java.util.ArrayList; import android.os.Bundle; import android.support.v7.app.ActionBarActivity; import android.view.Menu; import android.widget.ArrayAdapter; import android.widget.ListView; import com.manuelpeinado.fadingactionbar.extras.actionbarcompat.FadingActionBarHelper; import com.manuelpeinado.fadingactionbar.samples.actionbarcompat.R; public class ListViewActivity extends ActionBarActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); FadingActionBarHelper helper = new FadingActionBarHelper() .actionBarBackground(R.drawable.ab_background)// 设置actionbar的背景 .headerLayout(R.layout.header)// 设置actionbar上图片的布局,不限于图片 .contentLayout(R.layout.activity_listview);// 设置主界面 //初始化 setContentView(helper.createView(this)); helper.initActionBar(this); ListView listView = (ListView) findViewById(android.R.id.list); ArrayList<String> items = loadItems(R.raw.nyc_sites); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, items); listView.setAdapter(adapter); } /** * @return A list of Strings read from the specified resource * 从资源文件中读取文字,读一行设置一个list的item */ private ArrayList<String> loadItems(int rawResourceId) { try { ArrayList<String> countries = new ArrayList<String>(); //建立输入流 InputStream inputStream = getResources().openRawResource(rawResourceId); BufferedReader reader = new BufferedReader(new InputStreamReader(inputStream)); String line; while ((line = reader.readLine()) != null) { countries.add(line); } reader.close(); return countries; } catch (IOException e) { return null; } } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.activity_menu, menu); return true; } }
其实,关键代码就是这些:初始化后设置适配器
FadingActionBarHelper helper = new FadingActionBarHelper() .actionBarBackground(R.drawable.ab_background)// 设置actionbar的背景 .headerLayout(R.layout.header)// 设置actionbar上图片的布局,不限于图片 .contentLayout(R.layout.activity_listview);// 设置主界面,就一个listview //初始化 setContentView(helper.createView(this)); helper.initActionBar(this); ListView listView = (ListView) findViewById(android.R.id.list); ArrayList<String> items = loadItems(R.raw.nyc_sites); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, items); listView.setAdapter(adapter);
2.scrollview+fadingactionbar
建立布局文件,这里放一个layout和textview,给textview中设置多点的文字。
注意:这里不用设置scrollview,只要超出了屏幕显示的范围,这个actionbar会自动设置滚动
<?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="wrap_content" android:background="?android:attr/windowBackground" android:orientation="vertical" > <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:padding="15dp" android:text="@string/loren_ipsum" android:textAppearance="@android:style/TextAppearance.Medium" /> </LinearLayout>
ScrollViewActivity
/* * Copyright (C) 2013 Manuel Peinado * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package com.manuelpeinado.fadingactionbar.samples.actionbarcompat; import android.os.Bundle; import android.support.v7.app.ActionBarActivity; import android.view.Menu; import com.manuelpeinado.fadingactionbar.extras.actionbarcompat.FadingActionBarHelper; import com.manuelpeinado.fadingactionbar.samples.actionbarcompat.R; public class ScrollViewActivity extends ActionBarActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); FadingActionBarHelper helper = new FadingActionBarHelper() .actionBarBackground(R.drawable.ab_background)//设置actionbar的背景色 .headerLayout(R.layout.header)// 设置actionbar上图片的layout .contentLayout(R.layout.activity_scrollview);// 设置界面内容的布局 setContentView(helper.createView(this));// 配置布局 helper.initActionBar(this);// 用当前对象进行初始化 } }
其实fadingactionbar可以适配,fragment,draw等多种布局。具体的还是在官方的demo中了解吧。其实大同小异,很简单的。