Android 自定义布局控件-圆形RelativeLayout

Android 自定义布局控件-圆形RelativeLayout

在自己做的一个项目中经常需要在圆形布局文件中放控件，于是自己做了一个圆形的RelativeLayout，功能比较单一，可以设置背景色和透明度。

• 效果图
  

• 创建自定义类

package com.jzy.circularlayout;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.RelativeLayout;

public class CircleRelativeLayout extends RelativeLayout {
    private int color;
    private int[] colors;
    private int alpha;
    public CircleRelativeLayout(Context context) {
        super(context);
    }
    public CircleRelativeLayout(Context context, AttributeSet attrs) {
        super(context,attrs);
        init(context,attrs);
        setWillNotDraw(false);
    }
    private void init(Context context, AttributeSet attrs) {
        TypedArray array = context.obtainStyledAttributes(attrs,
                R.styleable.CircleRelativeLayoutLayout);
        color = array.getColor(R.styleable.CircleRelativeLayoutLayout_background_color,0X0000000);
        alpha = array.getInteger(R.styleable.CircleRelativeLayoutLayout_background_alpha,100);
        setColors();
        array.recycle();
    }
    @Override
    protected void onDraw(Canvas canvas) { //构建圆形
        int width = getMeasuredWidth();
        Paint mPaint = new Paint();
        mPaint.setARGB(alpha,colors[0],colors[1],colors[2]);
        mPaint.setAntiAlias(true);
        float cirX = width / 2;
        float cirY = width / 2;
        float radius = width / 2;
        canvas.drawCircle(cirX, cirY, radius, mPaint);
        super.onDraw(canvas);
    }

    public void setColor(int color) { //设置背景色
        this.color = color;
        setColors();
        invalidate();
    }

    public void setAlhpa(int alhpa) { //设置透明度
        this.alpha = alhpa;
        invalidate();
    }


    public void setColors() {
        int red = (color & 0xff0000) >> 16;
        int green = (color & 0x00ff00) >> 8;
        int blue = (color & 0x0000ff);
        this.colors = new int[]{red,green,blue};
    }

}

• 添加自定义属性 values/attr.xml

<resources>
    <declare-styleable name="CircleRelativeLayoutLayout">
        <attr name="background_color" format="color" />
        <attr name="background_alpha" format="integer" />
    declare-styleable>
resources>

• 布局文件

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:circle="http://schemas.android.com/apk/res-auto"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.jzy.circularlayout.MainActivity">
    <com.jzy.circularlayout.CircleRelativeLayout
        android:layout_margin="5dp"
        android:layout_width="100dp"
        android:layout_height="100dp">
        <TextView
            android:textColor="#ffffff"
            android:text="默认的颜色"
            android:layout_centerInParent="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    com.jzy.circularlayout.CircleRelativeLayout>
    <com.jzy.circularlayout.CircleRelativeLayout
        circle:background_color="#3838e4"
        circle:background_alpha="100"
        android:layout_marginLeft="110dp"
        android:layout_marginTop="5dp"
        android:layout_width="90dp"
        android:layout_height="90dp">
        <TextView
            android:textColor="#ffffff"
            android:text="自定义"
            android:layout_centerInParent="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    com.jzy.circularlayout.CircleRelativeLayout>
    <com.jzy.circularlayout.CircleRelativeLayout
        android:id="@+id/crlayout"
        android:layout_marginLeft="210dp"
        android:layout_marginTop="5dp"
        android:layout_width="80dp"
        android:layout_height="80dp">
        <TextView
            android:textColor="#ffffff"
            android:text="代码设置"
            android:layout_centerInParent="true"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    com.jzy.circularlayout.CircleRelativeLayout>
RelativeLayout>

• 获取和设置控件

public class MainActivity extends Activity {
    CircleRelativeLayout crlayout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        crlayout = (CircleRelativeLayout) findViewById(R.id.crlayout);
        crlayout.setColor(getResources().getColor(R.color.colorAccent));
        crlayout.setAlhpa(160);
    }
}