Android 实现ListView圆角效果
今天,简单讲讲如何实现使用
ListView显示圆角。
其实代码很多都可以解决,这是在网上搜索的一个解决的代码。
无论是网站,还是APP,人们都爱看一些新颖的视图效果。直角看多了,就想看看圆角,这几年刮起了一阵阵的圆角设计风:CSS新标准纳入圆角元素,特别是在iphone中几乎随处可见圆角设计,现在也开始出现很多圆角名片了。
现在就给大家实现一个圆角的ListView效果。 圆角的设计,我们并不追求到处都用,无处不用,android中有少数界面用直角确实容易显得锋利,和周边界面太过对比而显得不协调,比如大栏目列表,设置等等,而采用圆角实现,则会活泼,轻松的多,也融合的特别好。
先看下在IPhone中实现圆角效果的一个图片:
具体实现
本文采用shape 方式实现。
l 圆角背景list_corner_round_bg..xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"><!-- 渐变 --><gradient android:angle="180" android:endColor="#FFCCCCCC"android:startColor="@android:color/white" /><!-- 描边 --><stroke android:width="1dp" android:color="@color/color_gray" /><!-- 实心填充 --><solid android:color="@color/color_white" /><!-- 圆角 --><corners android:bottomLeftRadius="8dip"android:bottomRightRadius="8dip" android:topLeftRadius="8dip"android:topRightRadius="8dip" /></shape>
l List第一项背景 list_corner_round_top.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" ><!--渐变 <gradient android:startColor="#B5E7B8" android:endColor="#76D37B" android:angle="270"/>--><gradientandroid:angle="270"android:endColor="#40B9FF"android:startColor="#BFEEFF" /><cornersandroid:topLeftRadius="8dip"android:topRightRadius="8dip" /></shape>
l List中间项背景list_corner_round_mid.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" ><!--渐变 <gradient android:startColor="#B5E7B8" android:endColor="#76D37B" android:angle="270"/>--><gradientandroid:angle="270"android:endColor="#40B9FF"android:startColor="#BFEEFF" /></shape>
l List最后项背景 list_corner_round_bottom.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" ><!--渐变 <gradient android:startColor="#B5E7B8" android:endColor="#76D37B" android:angle="270"/>--><gradientandroid:angle="270"android:endColor="#40B9FF"android:startColor="#BFEEFF" /><cornersandroid:bottomLeftRadius="8dip"android:bottomRightRadius="8dip" /></shape>
l List 只有一项的情况时的背景 list_corner_round.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" ><!--渐变 <gradient android:startColor="#B5E7B8" android:endColor="#76D37B" android:angle="270"/>--><gradientandroid:angle="270"android:endColor="#40B9FF"android:startColor="#BFEEFF" /><cornersandroid:bottomLeftRadius="8dip"android:bottomRightRadius="8dip"android:topLeftRadius="8dip"android:topRightRadius="8dip" /></shape>
l 继承ListView的CornerListView.lava
public class CornerListView extends ListView {public CornerListView(Context context) {super(context);}public CornerListView(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);}public CornerListView(Context context, AttributeSet attrs) {super(context, attrs);
;}@Overridepublic boolean onInterceptTouchEvent(MotionEvent ev) {switch (ev.getAction()) {case MotionEvent.ACTION_DOWN:int x = (int) ev.getX();int y = (int) ev.getY();int itemnum = pointToPosition(x, y);if (itemnum == 0) {if (itemnum == (getAdapter().getCount() - 1)) {// 只有一项setSelector(R.drawable.list_corner_round);} else {// 第一项setSelector(R.drawable.list_corner_round_top);}} else if (itemnum == (getAdapter().getCount() - 1))// 最后一项setSelector(R.drawable.list_corner_round_bottom);else {// 中间一项setSelector(R.drawable.list_corner_round_mid);}break;case MotionEvent.ACTION_UP:break;}return super.onInterceptTouchEvent(ev);}
}
l 主界面布局
<com.aaron.csdn.CornerListViewandroid:id="@+id/local_listView"android:layout_width="fill_parent"android:layout_height="wrap_content"android:layout_margin="10dp"android:background="@drawable/list_corner_round_bg"android:cacheColorHint="#00000000"android:divider="#000000"android:dividerHeight="0.5px"android:fadingEdge="none" />
注意事项
solid:实心,就是填充的意思
android:color指定填充的颜色
gradient:渐变
android:startColor和android:endColor分别为起始和结束颜色,ndroid:angle是渐变角度,必须为45的
整数倍。
另外渐变默认的模式为android:type="linear",即线性渐变,可以指定渐变为径向渐
变,android:type="radial",径向渐变需要指定半径android:gradientRadius="50"。
stroke:描边
android:width="2dp" 描边的宽度,android:color描边的颜色。
我们还可以把描边弄成虚线的形式,设置方式为:
android:dashWidth="5dp"
android:dashGap="3dp"
其中android:dashWidth表示'-'这样一个横线的宽度,android:dashGap表示之间隔开的距离。
corners:圆角
android:radius为角的弧度,值越大角越圆。
效果
这里简单讲讲,其实就是先写三个shape文件,一个是上面都是圆角,一个是下面都是圆角,一个是上下都是圆角。然后自定义一个listview,重写onInterceptTouchEvent,让listview根据item所在位置和listview的数据总数来确定布局。
Android 实现ListView圆角效果就讲完了。
就这么简单。
Android 实现ListView圆角效果相关推荐
- Android实现ListView圆角效果
本文演示如何Android中实现ListView圆角效果. 无论是网站,还是APP,人们都爱看一些新颖的视图效果.直角看多了,就想看看圆角,这几年刮起了一阵阵的圆角设计风:CSS新标准纳入圆角元素,特 ...
- 直播电商软件开发,Android CardView实现圆角效果
直播电商软件开发,Android CardView实现圆角效果实现相关代码 使用cardCornerRadius就可以直接实现圆角效果,代码如下 <androidx.cardview.widge ...
- android 之ListView分页效果以及从网络上加载数据一系列的综合运用
数据分页策略: <1>:用多少查多少 <2>:全部查询出来,再进行分页处理 数据分页的有关算法: (1):起始索引值 = (当前页-1)*每页显示的记录数 (2):结束索引值 ...
- android listview立体效果,Android 实现ListView 3D效果 - 1
一.有图有真相 二.简单分析 1. ListView 3D实现整体布局使用自定义ListView, 只是继承自ListView父类的父类AdapterView,具体实现可参考之前写的文章: <A ...
- android自定义listview实现圆角
在项目中我们会经常遇到这种圆角效果,因为直角的看起来确实不那么雅观,可能大家会想到用图片实现,试想上中下要分别做三张图片,这样既会是自己的项目增大也会增加内存使用量,所以使用shape来实现不失为一种 ...
- Android ListView 圆角
android ListView实现圆角实例教程二 Android框架浅析之锁屏(Keyguard)机制原理 http://www.eoeandroid.com/thread-181604-1-1.h ...
- Android Shape属性corners 圆角效果,边框效果...
1,Corners [1]Corners标签是用来字义圆角的,其中radius与其它四个并不能共同使用. [2]android:radius:定义四个角的的圆角半径. [3]其它四个是逐个字义每个角的 ...
- android 圆角效果
android 圆角效果 最近做一个效果,要一个上边两个角为圆角,下面两个角为直角的四边形白色背景: 如下图: 这里用到了shape属性中的corners 属性, api原文中是这样: <cor ...
- android 设置4个棱角的颜色,整个布局圆角效果,类似图片圆角
先看效果图,是三个imageview在一条直线显示,给顶部圆角以及底部圆角,先看未圆角效果的图: 圆角后: 可以看到效果 中间的没有变,只变换了最上面以及最底部.... 实现的原理 就是给整个布局的四 ...
最新文章
- 谷歌研究发现优秀的团队必须具备这五个关键特质
- 【杂谈】为何有三AI只做原创,从不转载
- Apexchart整数多出小数点
- 开发人员如何成为架构师
- 部署 SaltStack 自动化运维工具,并简易批量安装 httpd 服务
- ue4小白人骨骼定义_【Blender】用SkinModifier+骨骼顶点“灵活”快速创建雕刻需要用的基本人物模型...
- keras sklearn下两分类/多分类的技术杂谈(交叉验证和评价指标)
- [Note] FrameFab Interesting Cut Results
- [翻译] 物理引擎javascript实现
- word 的脚注横线和文字怎么调整为左对齐?
- PopClip翻译插件开发记录-microsoft_translate.popclipext
- python使用 difflib 对比 两个文档 差异
- glassfish配置错误问题
- java下一页按钮_如何仅使用Spring在Java中单击提交按钮后才能转到下一页
- MySQL-实操:部门、员工信息与管理
- Linux运维人员成长之路必学书籍资料推荐
- nginx正向代理,提供爬虫请求代理
- qcon_从QCon旧金山2010获得的主要外卖点和经验教训
- 让数据动起来!用Python制作动画可视化效果,让数据不再枯燥!
- 开发android电视app