Android学习自定义View(三)——自绘控件和组合控件

简介: MainActivity如下: package cc.testviewstudy3;import android.os.Bundle;import android.

MainActivity如下:

package cc.testviewstudy3;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.app.Activity;
/**
 * Demo描述:
 * 关于自定义View的学习(三)
 * 
 * 自定义View的实现方式大概可以分为三种:
 * 自绘控件、组合控件、以及继承控件
 * 在此Demo中实现自绘控件和组合控件
 * 
 * 学习资料:
 * http://blog.csdn.net/guolin_blog/article/details/17357967
 * Thank you very much
 * 
 */
public class MainActivity extends Activity {
    private TitleViewFrameLayout mTitleViewFrameLayout;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);
		init();
	}

	private void init(){
		mTitleViewFrameLayout=(TitleViewFrameLayout) findViewById(R.id.titleViewFrameLayout);
		mTitleViewFrameLayout.setBackButtonText("返回");
		mTitleViewFrameLayout.setTitleTextViewText("标题");
		mTitleViewFrameLayout.setButtonClickListener(new OnClickListener() {
			@Override
			public void onClick(View v) {
				System.out.println("点击了Back");
				finish();
			}
		});
	}
}


CounterView如下:

package cc.testviewstudy3;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.View;

//自绘控件
public class CounterView extends View implements View.OnClickListener{
    private Paint mPaint;
    private Rect mRect;
    private Rect mTextBoundsRect;
    private int counter=0;
	public CounterView(Context context) {
		super(context);
	}
	
	public CounterView(Context context, AttributeSet attrs) {
		super(context, attrs);
		mPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
		mRect=new Rect();
		mTextBoundsRect=new Rect();
		//设置监听
		this.setOnClickListener(this);
	}
	
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		mPaint.setColor(Color.YELLOW);
		// getWidth()和getHeight()表示获得该自定义View本身的宽和高
		canvas.drawRect(0, 0, this.getWidth(), this.getHeight(), mPaint);
		mPaint.setColor(Color.BLUE);
		mPaint.setTextSize(40);
		String counterString = String.valueOf(counter);

		//测量文字的宽和高,将此结果保存到一个Rect中.即此处的mTextBoundsRect
		mPaint.getTextBounds(counterString, 0, counterString.length(),mTextBoundsRect);
		float textBoundWidth = mTextBoundsRect.width();
		float textBoundHeight = mTextBoundsRect.height();
		System.out.println("textBoundWidth="+textBoundWidth+",textBoundHeight="+textBoundHeight);
        //画出文字
		canvas.drawText(counterString, getWidth() / 2-textBoundWidth/2, 
				        getHeight() / 2+textBoundHeight/2, mPaint);
	}

	
	/**
	 * 为实现对于自绘控件点击事件的监听
	 * 1 设置监听器,即this.setOnClickListener(this);
	 *   这个和在Activity中view.setOnClickListener()是同一道理
	 * 2 覆写 onClick(View v)方法
	 *  在该方法中完成业务逻辑后,调用this.invalidate();
	 *  this.invalidate()方法会去调用onDraw()方法,从而实现重绘
	 */
	@Override
	public void onClick(View v) {
		counter++;
		this.invalidate();
	}
	

}



TitleViewFrameLayout如下:

package cc.testviewstudy3;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.TextView;
//组合控件
public class TitleViewFrameLayout extends FrameLayout {
    private Button mBackButton;
    private TextView mTitleTextView;
    
	public TitleViewFrameLayout(Context context, AttributeSet attrs) {
		super(context, attrs);
		LayoutInflater.from(context).inflate(R.layout.test_title, this);
		mBackButton=(Button) findViewById(R.id.backButton);
		mTitleTextView=(TextView) findViewById(R.id.titleTextView);
	}
	
	//定义方法--->设置Button的文字
	public void setBackButtonText(String text){
		mBackButton.setText(text);
	}
	
	//定义方法--->设置Button的点击监听
	public void setButtonClickListener(OnClickListener listener){
		mBackButton.setOnClickListener(listener);
	}
	
	//定义方法--->设置TextView的文字
	public void setTitleTextViewText(String text){
		mTitleTextView.setText(text);
	}

}


main.xml如下:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <cc.testviewstudy3.TitleViewFrameLayout
        android:id="@+id/titleViewFrameLayout"
        android:layout_width="fill_parent"
        android:layout_height="80dip"
        android:layout_centerHorizontal="true" />

    <cc.testviewstudy3.CounterView
        android:layout_width="120dip"
        android:layout_height="120dip"
        android:layout_centerInParent="true" />

</RelativeLayout>

test_title如下:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="70dip"
    android:background="#fcf345" >

    <Button
        android:id="@+id/backButton"
        android:layout_width="70dip"
        android:layout_height="50dip"
        android:layout_centerVertical="true"
        android:layout_marginLeft="10dip"
        android:text="Back" />

    <TextView
        android:id="@+id/titleTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Title"
        android:textColor="#1ee123"
        android:textSize="20sp" />

</RelativeLayout>



相关文章
|
3天前
|
XML 编解码 Android开发
安卓开发中的自定义视图控件
【9月更文挑战第14天】在安卓开发中,自定义视图控件是一种高级技巧,它可以让开发者根据项目需求创建出独特的用户界面元素。本文将通过一个简单示例,引导你了解如何在安卓项目中实现自定义视图控件,包括创建自定义控件类、处理绘制逻辑以及响应用户交互。无论你是初学者还是有经验的开发者,这篇文章都会为你提供有价值的见解和技巧。
|
4天前
|
前端开发 Android开发 开发者
安卓应用开发中的自定义视图基础
【9月更文挑战第13天】在安卓开发的广阔天地中,自定义视图是一块神奇的画布,它允许开发者将想象力转化为用户界面的创新元素。本文将带你一探究竟,了解如何从零开始构建自定义视图,包括绘图基础、触摸事件处理,以及性能优化的实用技巧。无论你是想提升应用的视觉吸引力,还是追求更流畅的交互体验,这里都有你需要的金钥匙。
|
7天前
|
缓存 搜索推荐 Android开发
安卓应用开发中的自定义View组件实践
【9月更文挑战第10天】在安卓开发领域,自定义View是提升用户体验和实现界面个性化的重要手段。本文将通过一个实际案例,展示如何在安卓项目中创建和使用自定义View组件,包括设计思路、实现步骤以及可能遇到的问题和解决方案。文章不仅提供了代码示例,还深入探讨了自定义View的性能优化技巧,旨在帮助开发者更好地掌握这一技能。
|
9天前
|
Android开发
Android中SurfaceView的双缓冲机制和普通View叠加问题解决办法
本文介绍了 Android 平台上的 SurfaceView,这是一种高效的图形渲染控件,尤其适用于视频播放、游戏和图形动画等场景。文章详细解释了其双缓冲机制,该机制通过前后缓冲区交换来减少图像闪烁,提升视觉体验。然而,SurfaceView 与普通 View 叠加时可能存在 Z-Order 不一致、同步问题及混合渲染难题。文中提供了使用 TextureView、调整 Z-Order 和创建自定义组合控件等多种解决方案。
39 9
|
10天前
|
前端开发 搜索推荐 Android开发
探索安卓开发中的自定义视图##
【9月更文挑战第6天】 在安卓应用开发的世界里,自定义视图如同绘画艺术中的色彩,它们为界面设计增添了无限可能。通过掌握自定义视图的绘制技巧,开发者能够创造出既符合品牌形象又提升用户体验的独特界面元素。本文将深入浅出地介绍如何从零开始构建一个自定义视图,包括基础框架搭建、关键绘图方法实现、事件处理机制以及性能优化策略。准备好让你的安卓应用与众不同了吗?让我们开始吧! ##
|
1月前
|
XML 前端开发 Android开发
Android面试高频知识点(3) 详解Android View的绘制流程
View的绘制和事件处理是两个重要的主题,上一篇《图解 Android事件分发机制》已经把事件的分发机制讲得比较详细了,这一篇是针对View的绘制,View的绘制如果你有所了解,基本分为measure、layout、draw 过程,其中比较难理解就是measure过程,所以本篇文章大幅笔地分析measure过程,相对讲得比较详细,文章也比较长,如果你对View的绘制还不是很懂,对measure过程掌握得不是很深刻,那么耐心点,看完这篇文章,相信你会有所收获的。
68 2
|
2月前
|
消息中间件 前端开发 Android开发
Android面试题自定义View之Window、ViewRootImpl和View的三大流程
Android开发中,View的三大核心流程包括measure(测量)、layout(布局)和draw(绘制)。MeasureSpec类在测量过程中起到关键作用,它结合尺寸大小和模式(EXACTLY、AT_MOST、UNSPECIFIED)来指定View应如何测量。onMeasure方法用于自定义View的测量,布局阶段,ViewGroup调用onLayout确定子元素位置,而draw阶段按照特定顺序绘制背景、内容、子元素和装饰。整个流程始于ViewRootImpl的performTraversals,该方法触发测量、布局和绘制。
35 0