第一种:自定义View继承ViewGroup实现
自定义viewgroup,通过对xml中的每个控件获取他们的宽高,然后根据三角函数关系进行位置的放置
onMeasure是测量每个子控件的宽高
onLayout 是确定每个子控件要摆放到哪
首先是我们定义一个xml文件,然后通过自定义view获取里面的子空间,然后进行位置摆放
下面是xml文件代码:
<com.myview.MyWeiZhi
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:zph="http://schemas.android.com/apk/res-auto"
android:id="@+id/id_menu"
android:layout_width="match_parent"
android:layout_height="match_parent"
zph:radius1="12dp" >
<RelativeLayout
android:layout_width="15dp"
android:id="@+id/sp_user_imager"
android:background="@drawable/yuan_dan"
android:layout_height="15dp">
<TextView
android:id="@+id/sp_user_text"
android:layout_width="15dp"
android:layout_centerInParent="true"
android:text="01"
android:textSize="8sp"
android:gravity="center"
android:textColor="@color/colorbasse"
android:layout_height="15dp" />
</RelativeLayout>
<ImageView
android:id="@+id/image1"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image2"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image3"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image4"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image5"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image6"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image7"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image8"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image9"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
<ImageView
android:id="@+id/image10"
android:layout_width="4dp"
android:layout_height="4dp"
android:background="@drawable/hui_yuan"
/>
</com.myview.MyWeiZhi>
这里是10个小圆和一个大圆和大圆中的文字(序号)的布局文件.
下面是我们的自定义view代码
**
* Created by adminZPH on 2016/12/21.
* 这里是对桌位的每一个小的座位的划线,包含一个大的圆,并且大圆周边有12个小的圆
* 默认的属性是:大圆的背景是#FAE4E7 小圆的背景是#D5D3D4
* 选中的状态的属性是:大圆背景是红色 小圆也一样
*
*
* 总共的个数是不确定的
*
*/
public class MyWeiZhi extends ViewGroup {
/*
10个椅子的时候
private static final Double sin= Math.sin(36*Math.PI/180);
private static final Double sin18= Math.sin(18*Math.PI/180);
private static final Double cos= Math.cos(36*Math.PI/180);
private static final Double cos18= Math.cos(18*Math.PI/180);*/
private int mRadius;
private int seatnumber=10;//默认是10个防止出错
private int seatnumbernumber=0;
//如果想安装坐标点进行摆放的话,可以将onLayout中的x和y换成xx,yy;
private int xx;//坐标点
private int yy;//坐标点
private View mCButton;//中间大圆
public MyWeiZhi(Context context,int seatnumber,int seatnumbernumber,int xx,int yy)
{
this(context,null, 0,seatnumber,seatnumbernumber,xx,yy);
}
public MyWeiZhi(Context context, AttributeSet attrs)
{
this(context, attrs, 0,0,0,0,0);
}
public MyWeiZhi(Context context, AttributeSet attrs, int defStyle,int seatnumber,int seatnumbernumber,int xx,int yy)
{
super(context, attrs, defStyle);
this.seatnumber=seatnumber;
this.seatnumbernumber=seatnumbernumber;
this.xx= (int) SizeUtils.pxTodp(context,xx);
this.yy= (int) SizeUtils.pxTodp(context,yy);
mRadius = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP,
50, getResources().getDisplayMetrics());
TypedArray a = context.getTheme().obtainStyledAttributes(attrs,
R.styleable.MyWeizhi, defStyle, 0);
mRadius = (int) a.getDimension(R.styleable.MyWeizhi_radius1, TypedValue
.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20,
getResources().getDisplayMetrics()));
a.recycle();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec)
{
int count = getChildCount();
for (int i = 0; i < count; i++)
{
measureChild(getChildAt(i), widthMeasureSpec, heightMeasureSpec);
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b)
{
if (changed)
{
/**
* 当前控件的父控件的中心坐标
* */
int x=getMeasuredWidth()/2;
int y=getMeasuredHeight()/2;
/**
* 中心点绘制
* */
mCButton = getChildAt(0);
int cl1 = x;
int ct1 = y;
int cWidth1 = mCButton.getMeasuredWidth();
int cHeight1 = mCButton.getMeasuredHeight();
mCButton.layout(cl1-cWidth1/2, ct1-cHeight1/2, cl1 + cWidth1/2, ct1 +cHeight1/2);
/**
* 接着进行绘制小椅子,根据服务器获得的seatnumber个数进行
* layout(Left,Top,Right,Bottom)
* 绘制全部都根据每个控件的中心点坐标进行绘制,保证刚好平均分配并且在当前父控件的中心位置
* 根据三角函数关系 sin和cos进行获得每个子控件的中心点位置
*
* */
for (int i = 0; i < seatnumber; i++)
{
View child = getChildAt(i + 1);
// L T R B
int cl = (int) (x+mRadius*Math.sin((360/seatnumber*i)*Math.PI/180));
int ct = (int) (y-mRadius*Math.cos((360/seatnumber*i)*Math.PI/180));
int cWidth = child.getMeasuredWidth();
int cHeight = child.getMeasuredHeight();
child.layout(cl-cWidth/2, ct-cHeight/2, cl + cWidth/2, ct + cHeight/2);
}
}
}
}
在activity中可以进行初始话,并addview到布局中去
MyWeiZhi mMyWeiZhi=new MyWeiZhi(this,1,12,100,100);
这是第一种方法,通过自定义View继承ViewGroup实现