Android 如何使用shape绘制只有一个圆角的矩形
2015-06-03 15:40
661 查看
昨天UI设计师又给我出了一个难题
不过这难不倒我,哈哈
挺好看的页面,看着也不是很难,但是,设计师阴险的跟我说最下面的按钮是只有一个圆角
好吧,二话不说开始搭布局吧。上面的布局都很简单,下面的按钮倒是让我琢磨了一段时间。对于这种按钮大家第一反应就是用shape画个圆角矩形
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/color_default" />
<corners android:radius="8dp" />
</shape>
很简单的几行代码,但是还没有实现我们想要的效果,查阅资料知道corner属性不止radius,还有另外四个可以控制圆角大小的属性,分别是
topLeftRadius、topRightRadius、bottomLeftRadius、bottomRightRadius,特别要注意的是bottomLeftRadius是设置右下角半径的,这个不要弄混了。
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/color_default" />
<corners
android:topLeftRadius="0dp"
android:topRightRadius="0dp"
android:bottomLeftRadius="0dp"
android:bottomRightRadius="8dp" />
</shape>
这次应该可以实现设计图了吧,可是模拟器上怎么都是有两个圆角,不是我们想要的效果,于是各种查阅资料,试了很多方法还是达不到想要的,最后实在没办法了,真机跑一下试试吧,卧槽,完美实现,早说就不瞎折腾那么久了
所以说大家以后尽量用真机测试,避免出现类似情况。
欢迎大家指教 :)
不过这难不倒我,哈哈
挺好看的页面,看着也不是很难,但是,设计师阴险的跟我说最下面的按钮是只有一个圆角
好吧,二话不说开始搭布局吧。上面的布局都很简单,下面的按钮倒是让我琢磨了一段时间。对于这种按钮大家第一反应就是用shape画个圆角矩形
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/color_default" />
<corners android:radius="8dp" />
</shape>
很简单的几行代码,但是还没有实现我们想要的效果,查阅资料知道corner属性不止radius,还有另外四个可以控制圆角大小的属性,分别是
topLeftRadius、topRightRadius、bottomLeftRadius、bottomRightRadius,特别要注意的是bottomLeftRadius是设置右下角半径的,这个不要弄混了。
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/color_default" />
<corners
android:topLeftRadius="0dp"
android:topRightRadius="0dp"
android:bottomLeftRadius="0dp"
android:bottomRightRadius="8dp" />
</shape>
这次应该可以实现设计图了吧,可是模拟器上怎么都是有两个圆角,不是我们想要的效果,于是各种查阅资料,试了很多方法还是达不到想要的,最后实在没办法了,真机跑一下试试吧,卧槽,完美实现,早说就不瞎折腾那么久了
所以说大家以后尽量用真机测试,避免出现类似情况。
欢迎大家指教 :)
相关文章推荐
- Android布局的小窍门?
- Web布局连载——两栏固定布局(五)
- Android实现表情 抓取新浪表情
- 详解Android解析Xml的三种方式——DOM、SAX以及XMLpull
- 样式表CSS布局经验
- css网页布局中注意的几个问题小结
- DL.DT.DD实现左右的布局简单例子第1/2页
- 使用CSS框架布局的缺点和优点小结
- div+CSS网页布局的意义与副作用原因小结第1/2页
- CSS顶级技巧大放送,div+css布局必知
- 用div实现像table一样的布局方法
- 精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
- android自定义RadioGroup可以添加多种布局的实现方法
- android开发环境遇到adt无法启动的问题分析及解决方法
- Android开发 旋转屏幕导致Activity重建解决方法
- Android开发技巧之在a标签或TextView控件中单击链接弹出Activity(自定义动作)
- Android开发技巧之ViewStub控件惰性装载
- 瀑布流布局并自动加载实现代码
- SWT(JFace)体验之RowLayout布局
- Extjs学习笔记之七 布局