如何在Android中创build具有圆angular的ListView?
如何在Android中创build具有圆angular的ListView?
这是做这件事的一种方法(感谢Android文档!):
将以下内容添加到文件(例如customshape.xml)中,然后将其放在(res / drawable / customshape.xml)
<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#SomeGradientBeginColor" android:endColor="#SomeGradientEndColor" android:angle="270"/> <corners android:bottomRightRadius="7dp" android:bottomLeftRadius="7dp" android:topLeftRadius="7dp" android:topRightRadius="7dp"/> </shape>
完成创build该文件后,只需使用以下其中一种方法设置背景:
通过代码: listView.setBackgroundResource(R.drawable.customshape);
通过XML ,只需将以下属性添加到容器(例如:LinearLayout或任何字段):
android:background="@drawable/customshape"
希望有人认为它有用…
尽pipe这样做确实有效,但它也完成了整个背景颜色。 我正在寻找一种方法来做边界,只是用这个replaceXML布局代码,我很好走!
<shape xmlns:android="http://schemas.android.com/apk/res/android"> <stroke android:width="4dp" android:color="#FF00FF00" /> <padding android:left="7dp" android:top="7dp" android:right="7dp" android:bottom="7dp" /> <corners android:radius="4dp" /> </shape>
@克里斯 – 范 – 巴尔
对于那些有select突出显示背景矩形显示的顶部和底部行的问题,您需要将您的列表视图的select器设置为透明颜色。
listView.setSelector(R.color.transparent);
在color.xml中添加以下内容 –
<color name="transparent">#00000000</color>
我发现的另一种方法是通过在布局顶部绘制图像来掩盖布局。 它可能会帮助你。 查看Android XML四舍五入的angular落
另一种select的解决scheme突出显示列表中第一个和最后一个项目的问题:
将填充添加到列表背景的顶部和底部,等于或大于半径。 这可以确保select突出显示不会与angular落曲线重叠。
当您需要不透明的select突出显示时,这是最简单的解决scheme。
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <solid android:color="@color/listbg" /> <stroke android:width="2dip" android:color="#D5D5D5" /> <corners android:radius="10dip" /> <!-- Make sure bottom and top padding match corner radius --> <padding android:bottom="10dip" android:left="2dip" android:right="2dip" android:top="10dip" /> </shape>
其实,我认为最好的解决scheme是在这个链接描述:
http://blog.synyx.de/2011/11/android-listview-with-rounded-corners/
总之,它对顶部,中间和底部的项目使用不同的背景,所以顶部和底部的项目将被舍入。
其他答案是非常有用的,感谢作者!
但是我看不到如何自定义矩形,而不是禁止突出显示@alvins @bharat dojeha。
下面的工作,我创build一个圆形的列表视图项目容器没有大纲和一个浅灰色时select相同的形状:
你的XML需要包含一个select器,例如(在res / drawable / customshape.xml中):
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android" > <item android:state_pressed="true" > <shape xmlns:android="http://schemas.android.com/apk/res/android" > <stroke android:width="8dp" android:color="@android:color/transparent" /> <padding android:left="14dp" android:top="14dp" android:right="14dp" android:bottom="14dp" /> <corners android:radius="10dp" /> <gradient android:startColor="@android:color/background_light" android:endColor="@android:color/transparent" android:angle="225"/> </shape> </item> <item android:state_pressed="false"> <shape xmlns:android="http://schemas.android.com/apk/res/android" > <stroke android:width="8dp" android:color="@android:color/transparent" /> <padding android:left="14dp" android:top="14dp" android:right="14dp" android:bottom="14dp" /> <corners android:radius="10dp" /> <gradient android:startColor="@android:color/darker_gray" android:endColor="@android:color/transparent" android:angle="225"/> </shape> </item>
然后,您需要实现一个列表适配器并重写getView方法来将自定义select器设置为背景
@Override public View getView(int position, View convertView, ViewGroup parent) { //snip convertView.setBackgroundResource(R.drawable.customshape); //snip }
并需要'隐藏'默认的select矩形,例如在onCreate(我也隐藏我的瘦灰色分隔线之间的项目):
listView.setSelector(android.R.color.transparent); listview.setDivider(null);
这种方法解决了drawable的一个通用的解决scheme,而不仅仅是具有各种select状态的ListViewItem。
使边框ü必须在可绘制文件夹中创build另一个具有实体和angular的属性的xml文件,并在后台调用它
这对我来说非常方便。 如果您使用自己的CustomAdapter
我想build议另一个解决方法来完美地突出显示圆angular。
定义XML文件
首先,进入你的可绘制文件夹并创build4个不同的形状:
-
shape_top
<gradient android:startColor="#ffffff" android:endColor="#ffffff" android:angle="270"/> <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"/>
-
shape_normal
<gradient android:startColor="#ffffff" android:endColor="#ffffff" android:angle="270"/> <corners android:topLeftRadius="10dp" android:topRightRadius="10dp"/>
-
shape_bottom
<gradient android:startColor="#ffffff" android:endColor="#ffffff" android:angle="270"/> <corners android:bottomRightRadius="10dp" android:bottomRightRadius="10dp"/>
-
shape_rounded
<gradient android:startColor="#ffffff" android:endColor="#ffffff" android:angle="270"/> <corners android:topLeftRadius="10dp" android:topRightRadius="10dp" android:bottomRightRadius="10dp" android:bottomRightRadius="10dp"/>
现在,为每个形状创build一个不同的行布局,即shape_top
:
-
你也可以通过编程来改变背景。
<TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginLeft="20dp" android:layout_marginRight="10dp" android:fontFamily="sans-serif-light" android:text="TextView" android:textSize="22dp" /> <TextView android:id="@+id/txtValue1" android:layout_width="match_parent" android:layout_height="48dp" android:textSize="22dp" android:layout_gravity="right|center" android:gravity="center|right" android:layout_marginLeft="20dp" android:layout_marginRight="35dp" android:text="Fix" android:scaleType="fitEnd" />
并为每个形状列表定义一个select器,即shape_top
:
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Selected Item --> <item android:state_selected="true" android:drawable="@drawable/shape_top" /> <item android:state_activated="true" android:drawable="@drawable/shape_top" /> <!-- Default Item --> <item android:state_selected="false" android:drawable="@android:color/transparent" /> </selector>
改变你的CustomAdapter
最后,在CustomAdapter
定义布局选项:
if(position==0) { convertView = mInflater.inflate(R.layout.list_layout_top, null); } else { convertView = mInflater.inflate(R.layout.list_layout_normal, null); } if(position==getCount()-1) { convertView = mInflater.inflate(R.layout.list_layout_bottom, null); } if(getCount()==1) { convertView = mInflater.inflate(R.layout.list_layout_unique, null); }
那已经完成了!
我使用的自定义视图,我布局在其他的顶部,只是绘制了4个小angular落在背景相同的颜色。 无论视图内容是什么,它都可以工作,并且不会分配太多内存。
public class RoundedCornersView extends View { private float mRadius; private int mColor = Color.WHITE; private Paint mPaint; private Path mPath; public RoundedCornersView(Context context) { super(context); init(); } public RoundedCornersView(Context context, AttributeSet attrs) { super(context, attrs); init(); TypedArray a = context.getTheme().obtainStyledAttributes( attrs, R.styleable.RoundedCornersView, 0, 0); try { setRadius(a.getDimension(R.styleable.RoundedCornersView_radius, 0)); setColor(a.getColor(R.styleable.RoundedCornersView_cornersColor, Color.WHITE)); } finally { a.recycle(); } } private void init() { setColor(mColor); setRadius(mRadius); } private void setColor(int color) { mColor = color; mPaint = new Paint(); mPaint.setColor(mColor); mPaint.setStyle(Paint.Style.FILL); mPaint.setAntiAlias(true); invalidate(); } private void setRadius(float radius) { mRadius = radius; RectF r = new RectF(0, 0, 2 * mRadius, 2 * mRadius); mPath = new Path(); mPath.moveTo(0,0); mPath.lineTo(0, mRadius); mPath.arcTo(r, 180, 90); mPath.lineTo(0,0); invalidate(); } @Override protected void onDraw(Canvas canvas) { /*Paint paint = new Paint(); paint.setColor(Color.RED); canvas.drawRect(0, 0, mRadius, mRadius, paint);*/ int w = getWidth(); int h = getHeight(); canvas.drawPath(mPath, mPaint); canvas.save(); canvas.translate(w, 0); canvas.rotate(90); canvas.drawPath(mPath, mPaint); canvas.restore(); canvas.save(); canvas.translate(w, h); canvas.rotate(180); canvas.drawPath(mPath, mPaint); canvas.restore(); canvas.translate(0, h); canvas.rotate(270); canvas.drawPath(mPath, mPaint); } }