How could I create custom ListView like shown in this picture. I know I can make this happen with help of ScrollView and Layouts, but I need to do as a ListView.
Each listview item go over each other.
问问题
2869 次
5 回答
3
这可以帮助您 列出具有部分重叠的自定义视图项的视图 (Android)
于 2013-08-06T08:47:43.040 回答
2
我有这个代码，就像你的要求一样。通过将dividerheight减小为负值，列表可能会重叠
<?xml version="1.0" encoding="utf-8"?>
<ListView
android:id="@+id/list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#b5b5b5"
android:dividerHeight="-5dp"
android:listSelector="@drawable/list_selector" />
然后根据位置为适配器添加背景颜色。
public View getView(int position, View convertView, ViewGroup parent) {
View vi=convertView;
if(convertView==null)
vi = inflater.inflate(R.layout.list_row, null);
TextView title = (TextView)vi.findViewById(R.id.title); // title
TextView artist = (TextView)vi.findViewById(R.id.artist); // artist name
TextView duration = (TextView)vi.findViewById(R.id.duration); // duration
ImageView thumb_image=(ImageView)vi.findViewById(R.id.list_image); // thumb image
HashMap<String, String> song = new HashMap<String, String>();
if(position % 2 ==0){
vi.setBackgroundResource(R.drawable.listselector_1);
}else if(position % 3 ==0){
vi.setBackgroundResource(R.drawable.listselector_2);
}else{
vi.setBackgroundResource(R.drawable.listselector_3);
}
song = data.get(position);
// Setting all values in listview
title.setText(song.get(CustomizedListView.KEY_TITLE));
artist.setText(song.get(CustomizedListView.KEY_ARTIST));
duration.setText(song.get(CustomizedListView.KEY_DURATION));
imageLoader.DisplayImage(song.get(CustomizedListView.KEY_THUMB_URL), thumb_image);
return vi;
}
否则，您也可以根据需要使用列表选择器图像
于 2013-08-06T10:42:20.203 回答
1
感谢你们尝试帮助我解决这个问题。我在这里查看每个答案，最后得到我想要的。我认为将我的代码放在这里会更好，所以也许有人会有所帮助。唯一的区别是我创建的列表视图中也有阴影。
这是代码
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:my_font="http://schemas.android.com/apk/res/com.Helix.android.SmartBonus"
android:orientation="vertical"
android:id="@+id/mainLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="5dp"
>
<ImageView
android:id="@+id/imageview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/shadow_bg"
android:visibility="visible"/>
<RelativeLayout
android:id="@+id/secondLayout"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:background="@drawable/drop_shadow"
android:layout_below="@id/imageview">
<ImageView
android:id="@+id/companyImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/secret_logo_small"
android:layout_marginRight="10dp"/>
<TextView
android:id="@+id/companyDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/companyImageView"
android:textColor="@android:color/white"
android:layout_marginTop="7dp"
my_font:ttf_name="300"
android:text="Салон кросаты"/>
<TextView
android:id="@+id/companyName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@id/companyImageView"
android:layout_below="@id/companyDescription"
android:textColor="@android:color/white"
my_font:ttf_name="300"
android:text="Secret"/>
<TextView
android:id="@+id/companyPercentText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@android:color/white"
android:layout_marginTop="7dp"
android:textSize="19sp"
android:layout_marginRight="1dp"
android:layout_toLeftOf="@+id/companyPercent"
my_font:ttf_name="700"
android:text="-20"/>
<TextView
android:id="@id/companyPercent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:textColor="@android:color/white"
android:layout_marginTop="7dp"
android:textSize="12sp"
my_font:ttf_name="300"
android:text="%"/>
<ImageView
android:id="@+id/companyPercentImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@id/companyPercent"
android:layout_marginTop="7dp"
android:textColor="@android:color/white"
android:src="@drawable/percentage_devider"/>
<TextView
android:id="@+id/companyDistance"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="@id/companyPercentImage"
android:textSize="16dp"
android:textColor="#A57F1C"
my_font:ttf_name="300"
android:text="7m"/>
<LinearLayout
android:id="@+id/checkingButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/companyDistance"
android:layout_marginTop="10dp"
android:paddingRight="10dp"
android:paddingLeft="10dp"
android:focusable="false"
android:background="@drawable/green_button_bg"
android:visibility="gone">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textSize="16dp"
android:textColor="@android:color/white"
my_font:ttf_name="300"
android:text="Check-in"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:textSize="16dp"
android:layout_marginLeft="10dp"
android:textColor="@color/checkin_point_color"
android:layout_weight="1"
my_font:ttf_name="300"
android:text="@string/ten_point"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/slak"
/>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
适配器。
@Override
public View getView(int i, View view, ViewGroup viewGroup) {
ViewHolder viewHolder;
final Discount discount = getItem(i);
Discount prev_discount = null;
if (i > 0){
prev_discount = getItem(i-1);
}
if (view == null){
final LayoutInflater li = (LayoutInflater) mActivity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
view = li.inflate(R.layout.discount_data_item, viewGroup, false);
viewHolder = new ViewHolder();
viewHolder.logo = (ImageView)view.findViewById(R.id.companyImageView);
viewHolder.name = (SmartBonus_TextView)view.findViewById(R.id.companyName);
viewHolder.description = (SmartBonus_TextView)view.findViewById(R.id.companyDescription);
viewHolder.percent = (SmartBonus_TextView)view.findViewById(R.id.companyPercentText);
viewHolder.distance = (SmartBonus_TextView)view.findViewById(R.id.companyDistance);
viewHolder.mainLayout = (RelativeLayout)view.findViewById(R.id.mainLayout);
viewHolder.secondLayaout = (RelativeLayout)view.findViewById(R.id.secondLayout);
view.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) view.getTag();
}
if (i == 0){
viewHolder.mainLayout.setBackgroundColor(android.R.color.transparent);
setRoundedBackground(viewHolder.secondLayaout, Color.parseColor(discount.getBackgroundColor()));
} else {
viewHolder.mainLayout.setBackgroundColor(Color.parseColor(prev_discount.getBackgroundColor()));
setRoundedBackground(viewHolder.secondLayaout, Color.parseColor(discount.getBackgroundColor()));
}
return view;
}
private void setRoundedBackground(View view,int color){
final GradientDrawable gradientDrawable = (GradientDrawable) view.getBackground().mutate();
gradientDrawable.setColor(color);
gradientDrawable.invalidateSelf();
}
这是结果
于 2013-08-21T08:17:46.093 回答
0
您应该覆盖getView方法。
示例代码：
View getView(int position, View convertView, ViewGroup parent){
Object data = getItem(positon);
//usually data object should have type property
if(data.type == TYPE1){
return getLayoutInflater().inflate(R.layout.custom_xml1, null);
}else (data.type == TYPE2){
return getLayoutInflater().inflate(R.layout.custom_xml2, null);
}else{
return getLayoutInflater().inflate(R.layout.custom_xml, null);
}
};
注意：您应该重用convertView对象以提高性能。
于 2013-08-06T09:10:58.867 回答
0
好的，由于我有一些时间，我设法编写了几个步骤来完成您的任务。
1. Make Custom drawable using xml in drawable folder with top corners have radius..
2. Now in your Listview attributes just define negative divider height
Like, android:dividerHeight="-20dp"
3. Set the Custom Drawable as a background of List row in getView().
如果您能够为列表行动态地将颜色设置为可绘制，这也很好。（在getView()自定义适配器中）。
这是我从上述步骤中取得的成果：
于 2013-08-06T11:19:30.407 回答