本篇文章讲的是自定义观点之边缘凹凸的优惠券效果,之前有见过很多优惠券的效果都是使用了边缘凹凸的样式。和往常一样,主要总结一下在自定义视图的开发过程中需要注意的一些地方。
按照惯例,我们先来看看效果图
之所以想要弄清楚这个问题是因为代码里面用到了<代码> onSizeChanged() 方法,一开始我有点犹豫<代码> onSizeChanged>
包per.lijuan.coupondisplayviewdome;
进口android.content.Context;
进口android.graphics.Canvas;
进口android.util.AttributeSet;
进口android.util.Log;
进口android.widget.LinearLayout;/* *
*自定义边缘凹凸的优惠券效果
*由lijuan h=" + h +”, oldw=" + oldw + ", oldh=" + oldh);
}
@Override
保护空白>
09-27 15:29:31.957 8210 - 8210/per.lijuan。coupondisplayviewdome D/mDebug: CouponDisplayView:上下文,attrs defStyleAttr
09-27 15:29:31.957 8210 - 8210/per.lijuan。coupondisplayviewdome D/mDebug: CouponDisplayView:上下文,attrs
09-27 15:29:32.050 8210 - 8210/per.lijuan。coupondisplayviewdome D/mDebug:>
公共CouponDisplayView(上下文语境){
超级(上下文);
}
公共CouponDisplayView(上下文语境,AttributeSet attrs) {
超级(上下文,attrs);
}
我们需要注意的是超级应该改成这样,然后让一个参数的构造方法引用两个参数的构造方法,两个参数的构造方法引用三个参数的构造方法,代码如下:
公共CouponDisplayView(上下文语境){
这(上下文,null);
}
公共CouponDisplayView(上下文语境,AttributeSet attrs) {
这(上下文、attrs 0);
}
从上面的效果图来看,这个自定义视图和普通的Linearlayout, RelativeLayout一样,只是上下两边多了类似于半圆锯齿的形状,我们需要在上下两条线上画一个个白色的小圆来实现这种效果。
假如我们上下线的半圆以及半圆与半圆之间的间距是固定的,那么不同尺寸的屏幕肯定会画出不同数量的半圆,那么我们只需要根据控件的宽度来获取能画的半圆数。
我们观察效果图会发现,圆的数量总是圆间距数量,也就是说,假设圆的数量是circleNum,那么圆间距就是circleNum + 1,所以我们可以根据这个计算出circleNum:
circleNum=(int) ((w-gap)/(2 *半径+ gap));
这里的差距就是圆间距,半径是圆半径,w是视图的宽。
1,自定义视图的属性,首先在res/价值/下建立一个attr。xml,在里面定义我们的需要用到的属性以及声明相对应属性的取值类型
& lt; & # 63; xml version=" 1.0 " encoding=" utf - 8 " & # 63;比;
& lt; resources>
& lt; !——圆间距——比;
& lt; attr name==拔取?鞍刖丁备袷奖?
& lt; !——半径——比;
& lt; attr name==拔取?安罹唷备袷奖?
& lt; declare-styleable name=" CouponDisplayView比;
& lt; attr=鞍刖丁?祝辞名称;
& lt; attr name="差距"/比;
& lt;/declare-styleable>
& lt;/resources>
我们定义了圆间距和半径2个属性,格式是值该属性的取值类型,格式取值类型总共有10种,包括:字符串,颜色,用,整数,枚举,参考,浮动,布尔,分数和旗帜。
2,然后在XML布局中声明我们的自定义观点
& lt; & # 63; xml version=" 1.0 " encoding=" utf - 8 " & # 63;比;
& lt; LinearLayout xmlns: android=" http://schemas.android.com/apk/res/android "
xmlns:定制=" http://schemas.android.com/apk/res-auto "
android: layout_width=" match_parent "
android: layout_height=" match_parent "
android: layout_margin=16 dp”比;
& lt; per.lijuan.coupondisplayviewdome.CouponDisplayView
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android:背景=" # FBB039”
面向android:="水平"
android:填充=" 16 dp "
自定义:差距=" 8 dp”
自定义:半径=" 5 dp”比;
& lt; ImageView
android: layout_width=" 90 dp”
android: layout_height=" match_parent "
android: scaleType=" centerCrop "
android: src=" https://www.yisu.com/zixun/@mipmap ic_launcher "/比;
LinearLayout & lt;
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android: layout_marginLeft=" 5 dp "
面向android:=按怪薄北?
& lt; TextView
android: id=癅 + id/名称”
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android:文本="电影新客代金劵”
android: textSize=" 18 dp/比;
& lt; TextView
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android: paddingTop=" 5 dp "
android:文本="编号:525451122312431”
android: textSize=?2 dp/比;
& lt; TextView
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android: paddingTop=" 5 dp "
android:文本="满200元可用,限最新版本客户端使用”
android: textSize=?2 dp/比;
& lt; TextView
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android: paddingTop=" 5 dp "
android:文本="截止日期:2016-11-07”
android: textSize=?2 dp/比;
& lt;/LinearLayout>
& lt;/per.lijuan.coupondisplayviewdome.CouponDisplayView>
& lt;/LinearLayout>
