最近发现一个很有意思的三色阶梯,翻了下博客感觉写的都太过于复杂,毕竟只是玩一下组合式自定义控件吗,
所以我就写了这篇特别简单有能写出来的三色阶梯
效果:
自定义view的代码
/**
* date:2018/12/2
* author:王加辉(家辉辉辉)
* function:阶梯状自定义view
*/
public class ThreeColorView extends ViewGroup {
public ThreeColorView(Context context) {
this(context,null);
}
public ThreeColorView(Context context, AttributeSet attrs) {
this(context, attrs,0);
}
public ThreeColorView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
@Override//测量
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
//遍历所有子view去测量自己
measureChildren(widthMeasureSpec,heightMeasureSpec);
}
//布局
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
//获取子布局的数量
int count = getChildCount();
//初始化宽度和高度
int startWidth = 0;
int startHeight = 0;
for (int i=0; i<count; i++){
//获取当前view
View v = getChildAt(i);
//为view设置框
v.layout(startWidth,startHeight,startWidth+v.getMeasuredWidth(),startHeight+v.getMeasuredHeight());
//呈阶梯排列
if ((i+1)%3==0) {
//初始化宽
startWidth=0;
}else {
//对width进行赋值
startWidth += v.getMeasuredWidth();
}
//对高进行赋值
startHeight += v.getMeasuredHeight();
}
}
}
布局:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="@+id/btn_delete"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="-"/>
<TextView
android:layout_weight="3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="24dp"
android:gravity="center"
android:text="三色梯"/>
<Button
android:id="@+id/btn_add"
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="+"/>
</LinearLayout>
<com.wjh.test.view.ThreeColorView
android:id="@+id/myview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
MainActivity代码:
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private Button btn_delete;
private Button btn_add;
private ThreeColorView myview;
private int i = 0 ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
btn_delete = (Button) findViewById(R.id.btn_delete);
btn_add = (Button) findViewById(R.id.btn_add);
myview = (ThreeColorView) findViewById(R.id.myview);
btn_delete.setOnClickListener(this);
btn_add.setOnClickListener(this);
}
@Override
public void onClick(View v) {
//每次点击都能重新定位
i++;
//动态创建TextView
final TextView text= new TextView(this);
//设置宽高
text.setWidth(250);
text.setHeight(100);
//text.setText(" 条目"+i);
//text.setTextColor(Color.WHITE);//字体颜色白色
//定义阶梯
if((i+1)%3==0){
text.setBackgroundColor(Color.RED);//背景颜色绿色2
}else if ((i+1)%3==1){
text.setBackgroundColor(Color.GREEN);//背景颜色蓝色3
}else if ((i+1)%3==2){
text.setBackgroundColor(Color.BLUE);//背景颜色红色1
}
//添加view
myview.addView(text);
/**
* 左上角点击删除
*/
btn_delete.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//删除view
myview.removeView(text);
}
});
}
}