您的位置:首页 > 产品设计 > UI/UE

Android UI模板设计

2015-12-31 10:28 417 查看

一、 设计需要的属性(组合模式)

1、 先在values文件夹下建立一个Values XML文件

2、 继承了RetativeLayout,并重写了它的构造方法

3、 在构造方法中,将所有获取的属性的值存在TypeArray中

<declare-styleable name="Topbar">
<!--format为定义的类型-->
<attr name="title" format="string" />
<attr name="titleTextSize" format="dimension" />
<attr name="titleTextColor" format="color" />
<attr name="leftText" format="string" />
<!--reference可以引用资源中的文件-->
<attr name="leftBackground" format="reference|color" />
<attr name="leftTextColor" format="color" />
<attr name="rightText" format="string" />
<attr name="rightBackground" format="reference|color" />
<attr name="rightTextColor" format="color" />
</declare-styleable>


二、 实现一个我们的”View”

1、从TypeArray中取出相应的值,给予相应的变量

2、用layoutParams方法将控件添加到viewGroup,所有的属性都再layoutParams中设置,该变量就是控制按钮的控件以何种方式添加viewGroup中

public class Topbar extends RelativeLayout {

private Button leftButton;
private Button rightButton;
private TextView tvTitle;

//定义这些控件所需要的属性
private int leftTextColor;
private Drawable leftBackground;
private String leftText;

private int rightTextColor;
private Drawable rightBackground;
private String rightText;

private float titleTextSize;
private int titleTextColor;
private String title;

//将控件放入ViewGroup
private LayoutParams leftParms;
private LayoutParams rightParms;
private LayoutParams titleParms;

//因为需要自定义属性,所以用该方法
public Topbar(Context context, AttributeSet attrs) {
super(context, attrs);
//设计并获取自定义属性
TypedArray ta = context.obtainStyledAttributes(attrs,R.styleable.Topbar);
leftTextColor = ta.getColor(R.styleable.Topbar_leftTextColor, 0);//找到所对应的属性的key(atts自定义属性文件集合中的对应属性)
leftBackground = ta.getDrawable(R.styleable.Topbar_leftBackground);
leftText = ta.getString(R.styleable.Topbar_leftText);

rightTextColor = ta.getColor(R.styleable.Topbar_rightTextColor, 0);
rightBackground = ta.getDrawable(R.styleable.Topbar_rightBackground);
rightText = ta.getString(R.styleable.Topbar_rightText);

titleTextSize = ta.getDimension(R.styleable.Topbar_titleTextSize, 0);
titleTextColor = ta.getColor(R.styleable.Topbar_titleTextColor, 0);
title = ta.getString(R.styleable.Topbar_title);
//在使用完TypedArray变量后,进行回收(1、避免浪费资源;2、避免一些由于缓存所引起的错误)
ta.recycle();

leftButton = new Button(context);
rightButton = new Button(context);
tvTitle = new TextView(context);

leftButton.setTextColor(leftTextColor);
leftButton.setBackground(leftBackground);
leftButton.setText(leftText);

rightButton.setTextColor(rightTextColor);
rightButton.setBackground(rightBackground);
rightButton.setText(rightText);

tvTitle.setTextColor(titleTextColor);
tvTitle.setTextSize(titleTextSize);
tvTitle.setText(title);
tvTitle.setGravity(Gravity.CENTER);//显示文字居中

setBackgroundColor(0xFFF59563);
//传入长和宽
leftParms = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
//左对齐属性
leftParms.addRule(RelativeLayout.ALIGN_PARENT_LEFT, TRUE);
addView(leftButton, leftParms);

rightParms = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
rightParms.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,TRUE);
addView(rightButton,rightParms);

titleParms = new LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,LayoutParams.MATCH_PARENT);
titleParms.addRule(RelativeLayout.CENTER_IN_PARENT,TRUE);
addView(leftButton,titleParms);
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  android ui