1. 自定义View类型
1>自己绘制的:该view上边所有显示的内容都是自己绘制的,绘制代码在 onDraw中
2>组合控件:不用自己绘制,把所有系统提供的控件组合到一起就行;
3>继承控件:不用自己重新写,继承系统提供的就行,比如继承TextView、LinearLayout、ListView等;
下边通过实例代码看下这3种view用法
2. 实例代码
1>:自己绘制的:
自定义计数器:在构造方法中创建画笔对象、矩形区域,同时给矩形区域设置点击事件,每点击一次上边数字加1,然后调用 invalidate绘制即可
效果如下:
第一:CounterView代码如下:
/**
* ================================================
* Email: 2185134304@qq.com
* Created by Novate 2018/12/28 9:44
* Version 1.0
* Params:
* Description: 自定义计数器
* ================================================
*/
public class CounterView extends View implements View.OnClickListener{
// 画笔
private Paint mPaint ;
// 矩形区域
private Rect mRect ;
// 点击次数
private int mCount ;
public CounterView(Context context) {
this(context,null);
}
public CounterView(Context context, @Nullable AttributeSet attrs) {
this(context, attrs,0);
}
/**
* 自定义CounterView:
* 在构造方法中创建画笔对象、矩形区域,同时给矩形区域设置点击事件,
* 每点击一次上边数字加1,然后调用 invalidate绘制即可
*/
public CounterView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
// 创建画笔对象
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG) ;
// 创建矩形区域对象
mRect = new Rect() ;
// 给计数器注册点击事件
setOnClickListener(this);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// 设置画笔颜色为蓝色
mPaint.setColor(Color.BLUE);
// 画矩形区域
canvas.drawRect(0,0,getWidth(),getHeight(),mPaint);
// 设置画笔颜色为黄色
mPaint.setColor(Color.YELLOW);
mPaint.setTextSize(30);
String text = String.valueOf(mCount) ;
// 设置文字区域
mPaint.getTextBounds(text , 0 , text.length() , mRect);
// 文字宽度与高度
float textWidth = mRect.width() ;
float textHeight = mRect.height() ;
// 画文字
canvas.drawText(text , getWidth()/2-textWidth/2 , getHeight()/2+textHeight/2 , mPaint);
}
@Override
public void onClick(View v) {
// 点击一次计数器,就让次数加1
mCount++;
// 然后重新绘制CounterView:
// 调用此方法依次调用 performTraversals__performDraw__draw__onDraw
invalidate();
}
}
第二:activity_counterview布局文件:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<com.novate.test.view.CounterView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerInParent="true"
/>
</RelativeLayout>
第三:CounterViewActivity代码如下:
public class CountViewActivity extends AppCompatActivity{
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_counterview);
}
}
2>:组合控件:
在构造方法中动态加载这个组合控件的布局,同时在这个构造方法中给返回键添加点击事件,如果不想要用构造方法中的这个方法,下边提供了3个方法:
设置中间title标题
设置返回键标题
设置返回键点击事件
效果如下:
第一:TitleView代码如下:
/**
* ================================================
* Email: 2185134304@qq.com
* Created by Novate 2018/12/28 9:48
* Version 1.0
* Params:
* Description: 组合控件 - title标题
* ================================================
*/
public class TtileView extends FrameLayout {
// 左边Button
private Button mLeftButton ;
// 中间文字
private TextView mTitleText ;
public TtileView(@NonNull Context context) {
this(context,null);
}
public TtileView(@NonNull Context context, @Nullable AttributeSet attrs) {
this(context, attrs,0);
}
/**
* 组合控件:在构造方法中动态加载这个组合控件的布局,同时在这个构造方法中给返回键添加点击事件,
* 如果不想要用构造方法中的这个方法,下边提供了3个方法:
* 设置中间title标题
* 设置返回键标题
* 设置返回键点击事件
*/
public TtileView(@NonNull Context context, @Nullable AttributeSet attrs, @AttrRes int defStyleAttr) {
super(context, attrs, defStyleAttr);
// 动态加载布局:获取LayoutInflater实例对象并动态加载布局,把title子布局 添加到 当前FrameLayout中
LayoutInflater.from(context).inflate(R.layout.title , this);
mLeftButton = (Button) findViewById(R.id.btn_left);
mTitleText = (TextView) findViewById(R.id.title_text);
// 点击左边按钮返回
mLeftButton.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
((Activity)getContext()).finish();
}
});
}
/**
* 给标题设置文字
*/
public void setTitleText(String text){
mTitleText.setText(text);
}
/**
* 给返回按钮设置文字
*/
public void setLeftButtonText(String text){
mLeftButton.setText(text);
}
/**
* 返回按钮点击事件
*/
public void setLeftButtonListener(OnClickListener l){
mLeftButton.setOnClickListener(l);
}
}
第二:activity_titleview
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<com.novate.test.view.TtileView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/title_view"
></com.novate.test.view.TtileView>
</LinearLayout>
第三:TitleViewActivity
public class TitleViewActivity extends AppCompatActivity {
private TtileView mTitleView;
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_titleview);
mTitleView = (TtileView) findViewById(R.id.title_view);
mTitleView.setTitleText("我是标题");
mTitleView.setLeftButtonText("我是左边返回按钮");
/**
* 如果不用自定义TitleView中的返回键,这里可以重新实现该按钮点击事件,根据自己需求设置点击事件
*/
mTitleView.setLeftButtonListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(TitleViewActivity.this , "点击了返回按钮了" , Toast.LENGTH_SHORT).show();
}
});
}
}