尚硅谷Android项目之_硅谷商城项目全套源码解析(六、个人中心)

一、简介
承接上文：尚硅谷Android项目之_硅谷商城项目全套源码解析(五、发现) 
上篇博客概括的介绍了硅谷商城项目的发现模块技术要点。本篇内容给大家讲解硅谷商城项目个人中心模块，个人中心模块用的技术主要是标题头采用GradationTitleBar实现仿QQ空间标题栏渐变效果；

 二、详细资源地址

由于篇幅所限，详情情况见如下地址视频和笔记
项目免费视频讲解下载地址：http://www.atguigu.com/download.shtml
github地址：https://github.com/atguigu01/Shopping

作者：大海哥

三、效果演示：





四、技术详解：
1、标题头采用GradationTitleBar实现仿QQ空间标题栏渐变效果
1）布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

<com.hankkin.gradationscroll.GradationScrollView
android:id="@+id/sv_person"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<RelativeLayout
android:id="@+id/rl_person_header"
android:layout_width="wrap_content"
android:layout_height="170dp"
android:background="#f00">

<ImageView
android:layout_width="wrap_content"
android:layout_height="170dp"
android:background="@drawable/new_user_icon_background" />

<ImageButton
android:id="@+id/ib_user_avator"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_centerInParent="true"
android:background="@drawable/new_user_icon" />
</RelativeLayout>

<View
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="#eee" />

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="我的订单"
android:textColor="#5d5d5d" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:drawableRight="@drawable/home_arrow_right"
android:text="查看全部订单"
android:textColor="#5d5d5d" />
</RelativeLayout>

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#eee" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp">

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/new_order_status_fukuan" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="待付款"
android:textColor="#5d5d5d" />
</LinearLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/new_order_status_fahuo" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="待发货"
android:textColor="#5d5d5d" />
</LinearLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/new_order_status_shouhuo" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="待收获"
android:textColor="#5d5d5d" />
</LinearLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/new_order_status_finish" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="已完成"
android:textColor="#5d5d5d" />
</LinearLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@drawable/new_order_status_help" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="售后/退款"
android:textColor="#5d5d5d" />
</LinearLayout>
</LinearLayout>

<View
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="#eee" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_channel_icon_address"
android:text="收货地址" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_channel_icon_collect"
android:text="我的收藏" />

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="45dp"
android:background="#eee" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_icon_ticket"
android:text="我的电子票" />
<View
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="#eee" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_channel_icon_invitation"
android:text="邀请分享" />

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="45dp"
android:background="#eee" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_channel_icon_callcenter"
android:text="客服中心" />

<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_marginLeft="45dp"
android:background="#eee" />

<TextView
style="@style/TextStyle"
android:drawableLeft="@drawable/user_channel_icon_feedback"
android:text="服务反馈" />

<View
android:layout_width="match_parent"
android:layout_height="8dp"
android:background="#eee" />
</LinearLayout>

</com.hankkin.gradationscroll.GradationScrollView>

<TextView
android:id="@+id/tv_usercenter"
android:layout_width="match_parent"
android:layout_height="45dp"
android:gravity="center"
android:padding="10dp"
android:text="个人中心"
android:textColor="#0000"
android:textSize="20sp" />

</RelativeLayout>

2）代码初始化

@Bind(R.id.sv_person)
GradationScrollView svPerson;

3）实现渐变效果

@Override
public void initData() {
super.initData();

ViewTreeObserver vto = rlPersonHeader.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {

private int height;

@Override
public void onGlobalLayout() {
// 移除监听
tvUsercenter.getViewTreeObserver().removeGlobalOnLayoutListener(this);

// 获取顶部图片的高度
height = rlPersonHeader.getHeight();

// 监听滑动，改变透明度
svPerson.setScrollViewListener(new GradationScrollView.ScrollViewListener() {
@Override
public void onScrollChanged(GradationScrollView scrollView, int x, int y, int oldx, int oldy) {

if (y <= 0) {   //设置标题的背景颜色
tvUsercenter.setBackgroundColor(Color.argb((int) 0, 255, 0, 0));
} else if (y > 0 && y <= height) { //滑动距离小于banner图的高度时，设置背景和字体颜色颜色透明度渐变
float scale = (float) y / height;
float alpha = (255 * scale);
tvUsercenter.setTextColor(Color.argb((int) alpha, 255, 255, 255));
tvUsercenter.setBackgroundColor(Color.argb((int) alpha, 255, 0, 0));
} else {    //滑动到banner下面设置普通颜色
tvUsercenter.setBackgroundColor(Color.argb((int) 255, 255, 0, 0));
}
}
});
}
});
}