android ListView实现圆角(两种解决方案)

android ListView实现圆角(两种解决方案)首先呢,我们还是看几个示图:(这是360推出的一款天气预报APP(墨迹),很不错的一款哦,这里为她们做一个免费广告,哈哈.)          这种带有圆角的listview’看起来很棒吧,确实是这样,其实也不能这么说,主要方形太多了,斯通见惯就不值钱了,“物以稀为贵嘛”.就好比学java都搞androd,很明显嘛,为了多赚点钱,可是供过于求的话,就不这么乐观了,就好比现在

大家好,又见面了,我是你们的朋友全栈君。

首先呢,我们还是看几个示图:(这是360推出的一款天气预报APP(墨迹),很不错的一款哦,这里为她们做一个免费广告,哈哈.)

 android ListView实现圆角(两种解决方案)       android ListView实现圆角(两种解决方案)        android ListView实现圆角(两种解决方案)

这种带有圆角的listview' 看起来很棒吧,确实是这样,其实也不能这么说,主要方形太多了,斯通见惯就不值钱了,“物以稀为贵嘛”. 就好比学java都搞androd,很明显嘛,为了多赚点钱,可是供过于求的话,就不这么乐观了,就好比现在这个圆角,如果太多太多的话,我想若干时间段,肯定会被新的视图所代替.所以“跟随潮流,放宽眼线”很重要.不扯了,(网上实现例子很多)下面简单介绍下实现方法:(两种方法)

第一种:我们通过配置文件也就是shape自己实现圆角的背景,以及selector选中某项的背景.

首先我们要实现一个完整的圆角背景,用于默认与listview的background.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <stroke
        android:width="1dp"
        android:color="@color/gray" />

    <solid android:color="@color/white" />

    <corners android:radius="8dp" />

</shape>

接下来我们要实现也就是listview的第一项selector后背景的shape.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >

    <stroke
        android:width="1dp"
        android:color="@color/gray" />

    <solid android:color="@color/gray" />

    <corners
        android:topLeftRadius="8dp"
        android:topRightRadius="8dp" />

</shape>

下面呢,我们也要实现中间的shape,以及末尾的shape等等配置.这里就不写了.按照上面模仿就ok了.

第二种方法:我们用.9.png完全代替上面那些配置,(因为.9.png可以拉伸不毁容

所以listview的第一项,中间项,最后一项,以及就一项,我们都可以通过图片来实现.

这里我运用第一种方法:(也巩固下shape)

创建自定义的listview,用于实现setSelector及选中的效果.

   代码片段:

   

package com.jj.listview;

import android.content.Context;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.widget.AdapterView;
import android.widget.ListView;

/***
 * 自定义listview
 * 
 * @author Administrator
 * 
 */
public class MyListView extends ListView {
	public MyListView(Context context) {
		super(context);
	}

	public MyListView(Context context, AttributeSet attrs) {
		super(context, attrs);
	}

	/****
	 * 拦截触摸事件
	 */
	@Override
	public 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 == AdapterView.INVALID_POSITION)
				break;
			else {
				if (itemnum == 0) {
					if (itemnum == (getAdapter().getCount() - 1)) {
						// 只有一项
						setSelector(R.drawable.list_round);
					} else {
						// 第一项
						setSelector(R.drawable.list_top_round);
					}
				} else if (itemnum == (getAdapter().getCount() - 1))
					// 最后一项
					setSelector(R.drawable.list_bottom_round);
				else {
					// 中间项
					setSelector(R.drawable.list_center_round);
				}
			}
			break;
		case MotionEvent.ACTION_UP:
			break;
		}
		return super.onInterceptTouchEvent(ev);
	}
}

这段代码网上很多,几乎全部都是这么实现的,这里我简单介绍,如果说错了,请大家指出,

首先我们是实现了onInterceptTouchEvent这个方法,在这里我们也可以用onTouchEvent事件,都可以实现我们想要的效果.

onInterceptTouchEvent和onTouchEvent的区别:简单的来说前者可以拦截后者.

详细的请大家参考http://blog.csdn.net/jj120522/article/details/7944916  强烈建议大家看看.

下面一些逻辑虽说没有见过,我想大家都看得懂,(就是获取坐标(x,y),然后根据坐标获取listview相应的position值,没有返回-1,然后根据相应的position设置相应的setSelector ).有时间得好好研究下listview.对灵活运用很有帮助.


在这里我还要在说名一点,上面那个图形很显然不是一个listview,是三个listview,另外重要的是我们一个屏幕显示不完全,这时我们就用到了ScrollView,一提到这个我想大家都知道ScrollView和listview是冤家,不可能同时存在,不过网上有解决办法,原理就是我们动态show 我们的listview,

实现方法:

/***
	 * 动态设置listview的高度
	 * 
	 * @param listView
	 */
	public void setListViewHeightBasedOnChildren(ListView listView) {
		ListAdapter listAdapter = listView.getAdapter();
		if (listAdapter == null) {
			return;
		}
		int totalHeight = 0;
		for (int i = 0; i < listAdapter.getCount(); i++) {
			View listItem = listAdapter.getView(i, null, listView);
			listItem.measure(0, 0);
			totalHeight += listItem.getMeasuredHeight();
		}
		ViewGroup.LayoutParams params = listView.getLayoutParams();
		params.height = totalHeight
				+ (listView.getDividerHeight() * (listAdapter.getCount() - 1));
		// params.height += 5;// if without this statement,the listview will be
		// a
		// little short
		// listView.getDividerHeight()获取子项间分隔符占用的高度
		// params.height最后得到整个ListView完整显示需要的高度
		listView.setLayoutParams(params);
	}

我们在Listview的setAdapter后,在调用下这个方法就OK了,代码内容,我想大家都看的明白,就不多介绍了.

效果图:

android ListView实现圆角(两种解决方案)     android ListView实现圆角(两种解决方案)    android ListView实现圆角(两种解决方案)

样子虽丑陋了点,但是实现效果就行了,如果在项目中就另当别论了。

哈哈,实现起来简单吧,睡觉去.


下面介绍另外一种解决方法:(TableLayout)

/************************************************************************************************************************************/

对于简短的listview,加上如上面这些比较死的数据,我们完全没有必要用listview来实现,TableLout完全够了.主要是我们怎么实现带有弧度的边罢了,不过这也完全得力于shape的功劳,至于点击效果效果嘛,我们有selector,哈哈,下面介绍下实现:

 配置文件部分代码:

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scrollbars="none" >

        <LinearLayout
            android:id="@+id/ll_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical"
            android:paddingLeft="10dp"
            android:paddingRight="10dp" >
        </LinearLayout>
    </ScrollView>

很简单,我们主要用这个Linerlayout来呈放我们的Table.

实现代码:

package com.jj.corner;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.Map;

import android.R.color;
import android.app.Activity;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.ViewGroup.LayoutParams;
import android.view.Window;
import android.widget.ArrayAdapter;
import android.widget.LinearLayout;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.RelativeLayout;
import android.widget.SimpleAdapter;
import android.widget.TableLayout;
import android.widget.TableRow;
import android.widget.TextView;

public class MainActivity2 extends Activity {
	private LinearLayout ll_main;
	private TableLayout tableLayout;

	private LinearLayout.LayoutParams layoutParams;

	private static final String MSG_0[] = { "jjhappyforever" };

	private static final String MSG_1[] = { "天气动画", "通知栏天气" };

	private static final String MSG_2[] = { "桌面插件", "绑定微博", "天气分享", "通知与提示",
			"定时播报" };

	private static final String MSG_3[] = { "检查新版本", "发送建议", "帮助", "关于" };

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.main2);
		ll_main = (LinearLayout) findViewById(R.id.ll_main);
		showTable();
	}

	/***
	 * 显示table
	 */
	public void showTable() {

		layoutParams = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT,
				LayoutParams.WRAP_CONTENT);
		layoutParams.bottomMargin = 30;
		layoutParams.topMargin = 10;
		ll_main.addView(getTable(MSG_0), layoutParams);

		ll_main.addView(getTable(MSG_1), layoutParams);

		ll_main.addView(getTable(MSG_2), layoutParams);

		ll_main.addView(getTable(MSG_3), layoutParams);
	}

	/***
	 * 获取Table
	 * 
	 * @param array
	 * @return
	 */
	public TableLayout getTable(String[] array) {

		tableLayout = new TableLayout(this);
		tableLayout.setLayoutParams(layoutParams);
		tableLayout.setStretchAllColumns(true);

		for (int i = 0; i < array.length; i++) {
			TableRow tableRow = new TableRow(this);
			View view = getView(array[i], i, array.length);
			tableRow.addView(view);

			tableLayout.addView(tableRow);

		}
		return tableLayout;

	}

	/****
	 * 
	 * @param msg
	 *            显示信息
	 * @param current_Id
	 *            当前个数
	 * @param totle_Num
	 *            总个数
	 * @return
	 */
	public View getView(String msg, int current_Id, int totle_Num) {

		LinearLayout linearLayout = new LinearLayout(this);

		LinearLayout.LayoutParams layoutParams1 = new LinearLayout.LayoutParams(
				LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
		layoutParams1.height = 1;
		linearLayout.setOrientation(1);
		// 创建分割线
		View line = new View(this);
		line.setLayoutParams(layoutParams1);
		line.setBackgroundColor(getResources().getColor(R.color.black));

		View view = LayoutInflater.from(MainActivity2.this).inflate(
				R.layout.item, null);
		view.setBackgroundDrawable(new BitmapDrawable());

		view.setFocusable(true);
		view.setClickable(true);
		TextView textView = (TextView) view.findViewById(R.id.tv_list_item);
		textView.setText(msg);
		textView.setTextSize(20);

		// 只有一项
		if (totle_Num == 1) {
			view.setBackgroundResource(R.drawable.default_selector);
			return view;
		}
		// 第一项
		else if (current_Id == 0) {
			view.setBackgroundResource(R.drawable.list_top_selector);
		}
		// 最后一项
		else if (current_Id == totle_Num - 1) {
			view.setBackgroundResource(R.drawable.list_bottom_selector);
			line.setVisibility(View.GONE);
		} else
			view.setBackgroundResource(R.drawable.list_center_selector);

		linearLayout.addView(view);
		linearLayout.addView(line);

		return linearLayout;
	}
}

主要是getView有些复杂,不过都很好理解,相信大家都可以明白,只是没有动手做而已,小弟我只是想用这个练练手.

不过不要忘记我们的背景实现

这个是只有一项的背景,

default_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <stroke android:width="1dp" android:color="@color/gray" />

            <solid android:color="@color/gray" />

            <corners android:radius="8dp" />
        </shape></item>
    <item><shape>
            <stroke android:width="1dp" android:color="@color/gray" />

            <solid android:color="@color/white" />

            <corners android:radius="8dp" />
        </shape></item>

</selector>

list_top_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <stroke android:width="1dp" android:color="@color/gray" />

            <solid android:color="@color/gray" />

            <corners android:topLeftRadius="8dp" android:topRightRadius="8dp" />
        </shape></item>
    <item><shape>

            <solid android:color="@color/white" />

            <corners android:topLeftRadius="8dp" android:topRightRadius="8dp" />
        </shape></item>

</selector>

list_bottom_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <stroke android:width="1dp" android:color="@color/gray" />

            <solid android:color="@color/gray" />

            <corners android:bottomLeftRadius="8dp" android:bottomRightRadius="8dp" />
        </shape></item>
    <item><shape>

            <solid android:color="@color/white" />

            <corners android:bottomLeftRadius="8dp" android:bottomRightRadius="8dp" />
        </shape></item>

</selector>

list_center_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:state_pressed="true"><shape>
            <stroke android:width="1dp" android:color="@color/gray" />

            <solid android:color="@color/gray" />
        </shape></item>
    <item><shape>
            <solid android:color="@color/white" />
        </shape></item>

</selector>

主要就这么多了,下面我们来看下实现效果:

android ListView实现圆角(两种解决方案)    android ListView实现圆角(两种解决方案)     android ListView实现圆角(两种解决方案) 

怎么样,效果和上面一样吧,自我感觉这样实现比上面方面点,不过最重要的是因人而异,达成目的就OK了.

有不足的地方请留言指出.

 源码下载


    由于比较忙碌,顾不得大家一一发送,现将代码上传网上,如有需要,你可以下载查看.

     对你如有帮助,记得赞一个!

     Thranks for you !

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/160586.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • java解析xml汇总

    java解析xml汇总

  • 手机分辨率介绍_手机分辨率通俗讲解

    手机分辨率介绍_手机分辨率通俗讲解分辨率(resolution,港台称之为解释度)就是屏幕图像的精密度,是指显示器所能显示的像素的多少。由于屏幕上的点、线和面都是由像素组成的,显示器可显示的像素越多,画面就越精细,同样的屏幕区域内能显示的信息也越多,所以分辨率是个非常重要的性能指标之一。可以把整个图像想象成是一个

  • 【数据分析报告】携程客户分析与流失预测

    【数据分析报告】携程客户分析与流失预测目录一、项目背景与目的二、探索性分析2.1数据指标预览2.2数据概况2.3数据分布2.3.1数据分布总览2.3.2预定日期和入住日期2.3.3访问时间段2.3.4客户价值2.3.5消费能力指数2.3.6价格敏感指数分布2.3.6入住酒店平均价格2.3.7酒店星级偏好2.3.8订单取消率2.3.9用户年订单数分布2.3.10新老客户流失率三、数据预处理3.1去除不需要的字段与重复字段3.2数据类型转换3.3异常值处理3.3.1负数处理3.3.2极值处理3.4缺失值处理3.

    2022年10月18日
  • 2016西安教师职称计算机考试,2016教师职称计算机考试模块.doc[通俗易懂]

    2016西安教师职称计算机考试,2016教师职称计算机考试模块.doc[通俗易懂]2016教师职称计算机考试模块2015年教师职称计算机考试模块【职考宝典】为广大考生归纳2015年职称计算机考试模块,让考生提前进入考试氛围,了解考试题型,职考宝典涵盖面积广,模拟题库包含Internet应用,word2003、2007,winXP、wpsoffice、excel2003、2007,ppt2003、2007等。山东广东安徽内蒙古黑龙江湖南山西云南辽宁新疆浙江江西湖北广西甘肃陕西…

  • idea 2022.01.4激活码(注册激活)2022.02.14

    (idea 2022.01.4激活码)最近有小伙伴私信我,问我这边有没有免费的intellijIdea的激活码,然后我将全栈君台教程分享给他了。激活成功之后他一直表示感谢,哈哈~https://javaforall.cn/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~4KDD…

  • Vue子组件调用父组件的方法及传值「建议收藏」

    Vue子组件调用父组件的方法及传值「建议收藏」//父组件<template><divclass=”home”><HelloWorldref=”mychild”></HelloWorld><div@click=”clickParent”>clickme</div></div></template><script>importHelloWorldfrom’@/components/HelloW

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号