用FadingActionBar实现有头图的ActionBar

    

　　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中了解吧。其实大同小异，很简单的。

源码下载：http://download.csdn.net/detail/shark0017/7735599