Android自定义带标题边框的Layout

今天工作中又碰到个小问题，项目需要用到像Java Swing的JPanel一样带标题边框的布局，Android里没有类似控件，想到这个也不难，自己画了一个，是继承LinearLayout的一个自定义布局，当然，可以根据需要继承其他布局，基本都是一样的过程。

当然这个自定义布局有点瑕疵，就是标题占用了布局的一部分高度，子控件需要调整在布局中的垂直位置来避免和标题边框靠得过紧。

------------------本博客如未明正声明转载，皆为原创，转载请注明出处！------------------

下面贴代码：

/*** 一个像java swing的JPanel控件一样可以带标题边框的布局，可以指定标题位置、颜色、字体大小。* 另外还可以控制边框大小和边框的颜色。但是，子控件指定垂直布局适应的时候，子控件看起来并不在布局中间，* 因为标题高度占用了布局的一部分垂直空间，使用时子控件需要指定Margin Top，否则可能和标题重叠。* * This is a layout with title border, you can set a title just like Java-Swing JPanel.* and you can control the position, the color and the size of the title. In addition,* the border's color and size are always controlled.* * !FIXME: The title has its own height, so when the children's gravity set as {@link Gravity#CENTER} * or {@link Gravity#CENTER_VERTICAL} do not work well.* * @date 2013/09/24* @author Wison*/
public class TitleBorderLayout extends LinearLayout {/**  默认情况下标题在总长度的1/10处显示  */private static float DEFAULT_TITLE_POSITION_SCALE = 0.1f;public static int DEFAULT_BORDER_SIZE = 1;public static int DEFAULT_BORDER_COLOR = Color.GRAY;public static int DEAFULT_TITLE_COLOR = Color.BLACK;/** 边框面板的高度 */private int mBorderPaneHeight ;private Paint mBorderPaint;private float mBorderSize;private TextPaint mTextPaint;private CharSequence mTitle;private int mTitlePosition;public TitleBorderLayout(Context context) {this(context, null);}/*** Construct a new TitleBorderLayout with default style, overriding specific style* attributes as requested.* @param context* @param attrs*/public TitleBorderLayout(Context context, AttributeSet attrs) {super(context, attrs);setWillNotDraw(false);mBorderPaint = new Paint(Paint.ANTI_ALIAS_FLAG);mTextPaint = new TextPaint(Paint.ANTI_ALIAS_FLAG);Resources res = getResources();mTextPaint.density = res.getDisplayMetrics().density;TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.TitleBorderLayout);mTitle = a.getText(R.styleable.TitleBorderLayout_title);int titleColor = a.getColor(R.styleable.TitleBorderLayout_titleTextColor, DEAFULT_TITLE_COLOR);mTextPaint.setColor(titleColor);float titleTextSize = a.getDimension(R.styleable.TitleBorderLayout_titleTextSize, 0);if (titleTextSize > 0) {mTextPaint.setTextSize(titleTextSize);}mTitlePosition = a.getDimensionPixelSize(R.styleable.TitleBorderLayout_titlePosition, -1);mBorderSize = a.getDimensionPixelSize(R.styleable.TitleBorderLayout_borderSize, DEFAULT_BORDER_SIZE);int borderColor = a.getColor(R.styleable.TitleBorderLayout_borderColor, DEFAULT_BORDER_COLOR);mBorderPaint.setColor(borderColor);a.recycle();}/*** Get the color of border.* @return*/public int getBorderColor() {return mBorderPaint.getColor();}/*** Set the color of border.* @param borderColor*/public void setBorderColor(int borderColor) {mBorderPaint.setColor(borderColor);requestLayout();}/*** Get the size of border.* @return*/public float getBorderSize() {return mBorderSize;}/*** Set the size of border.* @param borderSize*/public void setBorderSize(float borderSize) {mBorderSize = borderSize;requestLayout();}/*** Get the color of title.* @return*/public int getTitleColor() {return mTextPaint.getColor();}/*** Set the color of title.* @param titleColor*/public void setTitleColor(int titleColor) {mTextPaint.setColor(titleColor);requestLayout();}/*** Get the size of title.* @return*/public float getTitleTextSize() {return mTextPaint.getTextSize();}/*** Set the size of title.* @param titleTextSize*/public void setTitleTextSize(float titleTextSize) {mTextPaint.setTextSize(titleTextSize);requestLayout();}/*** Get the title.* @return*/public CharSequence getTitle() {return mTitle;}/*** Set the title which will be shown on the top of border pane. * @param title*/public void setTitle(CharSequence title) {mTitle = title;requestLayout();}/*** Get the position of title.* @return*/public int getTitlePosition() {return mTitlePosition;}/*** Set the position of title where the paint will start to draw.* @param titlePosition*/public void setTitlePosition(int titlePosition) {mTitlePosition = titlePosition;requestLayout();}/*** Get the height of border pane, it's different from the layout height!* @return*/public int getBorderPaneHeight() {return mBorderPaneHeight;}/*** Draw the title border* @param canvas */@Overrideprotected void onDraw(Canvas canvas) {super.onDraw(canvas);FontMetrics fm = mTextPaint.getFontMetrics();final float titleHeight =  fm.descent - fm.ascent;final CharSequence titleText = (mTitle == null) ? "" : mTitle;final float titleWidth = Layout.getDesiredWidth(titleText, mTextPaint);final int width = getWidth();final int height = getHeight();if (mTitlePosition <= 0 || mTitlePosition + titleWidth > width) {mTitlePosition = (int) (DEFAULT_TITLE_POSITION_SCALE * width); }final float topBorderStartY = titleHeight / 3f - mBorderSize / 2;mBorderPaneHeight = (int) Math.ceil(height - topBorderStartY);/*  画标题边框  */// 上canvas.drawRect(0, topBorderStartY, mTitlePosition, topBorderStartY + mBorderSize, mBorderPaint);canvas.drawText(titleText.toString(), mTitlePosition, titleHeight / 3 * 2f, mTextPaint); // 标题canvas.drawRect(mTitlePosition + titleWidth, topBorderStartY, width, topBorderStartY + mBorderSize, mBorderPaint);// 左canvas.drawRect(0, topBorderStartY, mBorderSize, height, mBorderPaint);// 右canvas.drawRect(width - mBorderSize, topBorderStartY, width, height, mBorderPaint);// 下canvas.drawRect(0, height - mBorderSize, width, height, mBorderPaint);}}

以下为属性声明：

    <declare-styleable name="TitleBorderLayout"><!-- The title of BorderTitleLayout. --><attr name="title" format="string" /><!-- The size of title. --><attr name="titleTextSize" format="dimension" /><!-- The title start postion. --><attr name="titlePosition" format="dimension" /><!-- The color of title. --><attr name="titleTextColor" format="reference|color" /><!-- The size of border. --><attr name="borderSize" format="dimension" /><!-- The color of border. --><attr name="borderColor" format="reference|color" /></declare-styleable>

下面是效果图：

Android自定义带标题边框的Layout相关推荐

android 自定义进度条水量,Android自定义带水滴的进度条样式（带渐变色效果）...
一.直接看效果二.直接上代码 1.自定义控件部分 package com.susan.project.myapplication; import android.app.Activity; impo ...
android 带箭头的按钮,android自定义带箭头对话框
本文实例为大家分享了android自定义带箭头对话框的具体代码,供大家参考,具体内容如下 import android.content.context; import android.content. ...
android音频声调,Android自定义带拼音音调Textview
本文实例为大家分享了Android自定义带拼音音调Textview的具体代码,供大家参考,具体内容如下 1.拼音textview,简单的为把拼音数组和汉字数组结合在一起多行显示 import andr ...
Android 自定义带图标Toast，工具方法，Toast自定义显示时间
带图标Toast工具方法1 样式 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:an ...
android自定义带进度条的圆形图片
前言:在项目听新闻的改版中需要实现环绕圆形新闻图片的进度条功能,作为技术预备工作我就去看了一些网上的相关的原理,做了一个自定义带进度条的圆形图片的demo,并将这个实现写成文章发布出来,谁需要了可以进 ...
Android自定义view之measure、layout、draw三大流程
自定义view之measure.layout.draw三大流程一个view要显示出来,需要经过测量.布局和绘制这三个过程,本章就这三个流程详细探讨一下.View的三大流程具体分析起来比较复杂,本文不 ...
android 自定义组件圆形边框
在android开发中,我们经常要自定义组件如TextView等背景或边框为四角圆形. 首先,我们在drawable目录下新建一个xml文件,bg.xml <?xml version=" ...
Android——自定义带刻度的SeekBar单向拖动条
时间过得真快,才发现好久没来逛逛了.没写博客的这段时间一直在做项目,连续完成了两个大型app,这个过程很享受,这是独立开发的,所以中途有很多很多的问题需要自己一个一个的去解决,现在接近尾声了,发现自己 ...
android 自定义带输入框的dialog,Android 基本Dialog和自定义Dialog
Android 基本Dialog和自定义Dialog Dialog类是对话框的基类,但你应该避免直接实例化Dialog ,可以使用子类 1.AlertDialog 此对话框可以显示标题,最多三个按钮, ...

Android自定义带标题边框的Layout

Android自定义带标题边框的Layout相关推荐

最新文章

热门文章