Android实现个人中心设置界面

先上效果图:


Android实现个人中心设置界面_第1张图片

1.顶部磨砂图像背景以及圆形头像实现:

1)build.gradle中添加以下依赖:

compile 'com.github.bumptech.glide:glide:3.7.0' compile 'jp.wasabeef:glide-transformations:2.0.1'

2)画布局RelativeLayout

效果图:


Android实现个人中心设置界面_第2张图片


Android实现个人中心设置界面_第3张图片

Java代码:

Glide.with(this).load(R.drawable.head) .bitmapTransform(new BlurTransformation(this, 25), new CenterCrop(this)) .into(blurImageView); Glide.with(this).load(R.drawable.head) .bitmapTransform(new CropCircleTransformation(this)) .into(avatarImageView);

以上就是实现头部磨砂布局代码

2.下面讲个人中心实现

经分析我们发现这个列表项都是相同的重复布局,只是前面的图标和中间的文字是不同,那么我们可以考虑自定义一个布局,通过自定义属性设置它的图标和文字。然后放到一个LinearLayout布局中就可以实现这个列表界面。

1)自定义一个布局,实现如图效果:


布局代码我就不写了

2)自定义属性参数


Android实现个人中心设置界面_第4张图片

顺序分别为:是否显示下划线/左边图标/显示的文字

3)布局中引入自定义的命名空间/设置相关属性


Android实现个人中心设置界面_第5张图片


Android实现个人中心设置界面_第6张图片


Android实现个人中心设置界面_第7张图片

4)自定义view继承LinearLayout

获取设置的属性,动态设置给对应的控件


Android实现个人中心设置界面_第8张图片

解释代码:

加载布局LayoutInflater.from(getContext()).inflate(R.layout.item_view,this);

获取设置属性对象:

TypedArray ta=context.obtainStyledAttributes(attrs,R.styleable.item_view);

获取控件,设置属性值:isbootom= ta.getBoolean(R.styleable.item_view_show_bottomline, true);

bottomview= findViewById(R.id.item_bottom);

imageView = findViewById(R.id.item_img);textView = findViewById(R.id.item_text);textView.setText(ta.getString(R.styleable.item_view_show_text));imageView.setBackgroundResource(ta.getResourceId(R.styleable.item_view_show_leftimg, R.drawable.setting));

回收属性对象:ta.recycle();

以上就是完整实现设置中心的代码。想要项目代码,下载地址。

转自我的CSDN:http://blog.csdn.net/asfang/article/details/79144127

你可能感兴趣的:(Android实现个人中心设置界面)