最近項目要開發一個新版本,發現項目中許多布局大致都相同改動不大,并且布局中代碼量非常之多不好閱讀,針對項目相關內容進行了封裝。
實現思路:
通過繼承RelativeLayout實現動態添加所需要的控件,TextView ImageView View 一共封裝了8個控件 leftImg reightImg leftTv rightTv centerTv leftTopTv leftBottomTv bottomLine 根據需要動態添加AddView(View) 通過LayoutParams.addRule()設置控件的位置,LayoutParams.setMargins()設置大小進行所需控件的控制實現以下效果:
customtextlayout.png
下面看看自定義控件中幾個主要方法
添加ImageView(通過判斷布局是是否設置了leftImg屬性進行添加圖片,增加圖片的點擊回調事件)
//左邊圖片初始化
if (leftImgRes != null) {
initLeftImg();
}
private void initLeftImg() {
leftIV = new ImageView(mContext);
int width = leftImgWidht != 0 ? leftImgWidht : LayoutParams.WRAP_CONTENT;
int height = leftImgHeight != 0 ? leftImgHeight : LayoutParams.WRAP_CONTENT;
LayoutParams leftImgParams = new LayoutParams(width, height);
leftImgParams.addRule(ALIGN_PARENT_LEFT, TRUE);
leftImgParams.addRule(RelativeLayout.CENTER_VERTICAL, TRUE);
leftImgParams.setMargins(leftImgMarginleft, 0, 0, 0);
leftIV.setScaleType(ImageView.ScaleType.FIT_XY);
leftIV.setId(R.id.leftImg);
leftIV.setLayoutParams(leftImgParams);
leftIV.setImageDrawable(leftImgRes);
leftIV.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if (OnTextViewClickListener != null) {
OnTextViewClickListener.OnLeftImgClick();
}
}
});
addView(leftIV);
}
添加TextView
//左邊文字初始化
if (!TextUtils.isEmpty(leftTvString)) {
initLeftTv();
}
private void initLeftTv() {
leftTv = new TextView(mContext);
LayoutParams leftTvParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
leftTvParams.addRule(RelativeLayout.CENTER_VERTICAL, TRUE);
leftTvParams.addRule(RelativeLayout.RIGHT_OF, R.id.leftImg);
leftTvParams.setMargins(leftTvMarginleft, 0, 0, 0);
leftTv.setLayoutParams(leftTvParams);
leftTv.setTextColor(leftTvColor);
leftTv.setId(R.id.leftTv);
leftTv.setTextSize(TypedValue.COMPLEX_UNIT_PX, leftTvSize);
leftTv.setText(leftTvString);
addView(leftTv);
}
代碼中設置TextView的公共方法
//代碼設置左邊文字
public CustomTextView setLeftTv(String tvStr, String tvColor) {
leftTvString = TextUtils.isEmpty(tvStr) ? leftTvString : tvStr;
leftTvColor = TextUtils.isEmpty(tvColor) ? leftTvColor : Color.parseColor(tvColor);
if (leftTv == null) {
initLeftTv();
} else {
leftTv.setText(leftTvString);
leftTv.setTextColor(leftTvColor);
}
return this;
}
只需搞懂這三個方法,你也可以根據自己的項目需求定義自己需要的組合控件
使用方法
xml(根據自己需要的屬性自定義)
<com.dengxiao.customtextlayout.CustomTextView
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="#ffffff"
app:bottomLineHeight="1dp"
app:bottomLineShow="true"
app:bottomcolor="#eeeeee"
app:centerTvColor="#000"
app:centerTvSize="18sp"
app:centerTvString="標題"
app:leftImg="@drawable/btn_back_pressed"
app:leftImgHeight="40dp"
app:leftImgMarginleft="5dp"
app:leftImgWight="40dp"
app:leftTvColor="@color/colorAccent"
app:leftTvMarginleft="5dp"
app:leftTvSize="18sp"
app:leftTvString="左邊"
app:rightImg="@drawable/btn_forward_pressed"
app:rightImgHeight="50dp"
app:rightImgMarginright="10dp"
app:rightImgWidht="50dp"
app:rightTvColor="#52adff"
app:rightTvMarginright="10dp"
app:rightTvSize="19sp"
app:rightTvString="右邊" />
activity.java
customTextView1.setLeftImg(getResources().getDrawable(R.drawable.ic_search))
.setRightImg(getResources().getDrawable(R.drawable.icon_portrait))
.setLeftTv("代碼添加","#c95fdc")
.setRightTv("代碼添加","#4be1c3")
.setCenterTv("代碼",null)
.setLeftTopTv("上",null)
.setLeftBottomTv("下",null)
.setBottomLine("#1587e7")
.setCustomTvBackground("#4dacff");
customTextView1.setOnTextViewClickListener(new CustomTextView.OnTextViewClickListener(){
@Override
public void OnLeftImgClick() {
Toast.makeText(MainActivity.this,"左邊圖片",Toast.LENGTH_SHORT).show();
}
@Override
public void OnRightImgClick() {
Toast.makeText(MainActivity.this,"右邊圖片",Toast.LENGTH_SHORT).show();
}
@Override
public void OnTextViewClick() {
Toast.makeText(MainActivity.this,"布局",Toast.LENGTH_SHORT).show();
}
});