我想为列表制作卡片视图。但我没有得到正确的看法
I want to make a card view for listing . But I am not getting proper view
我想为列表制作卡片视图。但我没有得到正确的看法。
我想在左侧显示图像。在图像的右侧我想显示酒店名称、地区、等级、菜系。
但是现在通过这段代码一切都重叠了。
谁能帮帮我?我正在上传图片,我正在使用此代码。
见图片酒店名称、区域、评分、菜式重叠。如何解决这个问题?
这是我想要的通过卡片视图的屏幕截图
.
list_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
>
<!--<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/list_row_selector"
android:padding="8dp" >-->
<!-- Thumbnail Image -->
<android.support.v7.widget.CardView
android:id="@+id/ly_root"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FEFEFE"
android:layout_margin="8dp"
app:cardCornerRadius="4dp">
<!--<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
card_view:cardCornerRadius="4dp">-->
<com.android.volley.toolbox.NetworkImageView
android:id="@+id/thumbnail"
android:layout_width="120dp"
android:layout_height="80dp"
android:scaleType="centerCrop"
android:layout_marginRight="8dp" />
<!-- Restaurant name -->
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/title"
android:textStyle="bold" />
<TextView
android:id="@+id/area"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/name"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<!-- Rating -->
<TextView
android:id="@+id/average_ratings"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/area"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<TextView
android:id="@+id/cuisine"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/average_ratings"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<!-- Genre -->
<!-- <TextView
android:id="@+id/genre"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/rating"
android:layout_marginTop="5dp"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="@color/genre"
android:textSize="@dimen/genre" />-->
<!--
<!– Release Year –>
<TextView
android:id="@+id/releaseYear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textColor="@color/year"
android:textSize="@dimen/year" />-->
</android.support.v7.widget.CardView>
</LinearLayout>
使用 RelativeLayout 的 CardView 子项
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/ly_root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#FEFEFE"
app:cardCornerRadius="4dp">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.android.volley.toolbox.NetworkImageView
android:id="@+id/thumbnail"
android:layout_width="120dp"
android:layout_height="80dp"
android:layout_marginRight="8dp"
android:scaleType="centerCrop" />
<!-- Restaurant name -->
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/thumbnail"
android:textStyle="bold" />
<TextView
android:id="@+id/area"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/name"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E"/>
<!-- Rating -->
<TextView
android:id="@+id/average_ratings"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/area"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E" />
<TextView
android:id="@+id/cuisine"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/average_ratings"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E" />
</RelativeLayout>
</android.support.v7.widget.CardView>
一般来说,您的 CardView 应该只包含一种布局 - 您之前使用过的 RelativeLayout
。 CardView 本身无法按照您的意愿定位项目。
如果您查看 documentation,您会看到 CardView 扩展了 FrameLayout,它应该只包含一个子项,因此它不能控制 CardView 中的定位。
CardView 就像一个FrameLayout。布局中 cardView 中的后续项目将放置在前一个项目之上。
您可以将 TextView 的 layout_gravity 设置为 "right"。
这不是一个完美的方法。因此,我建议将 TextView 封装在 orientation="vertical" 的线性布局中,并将 LinearLayout 的 layout_gravity 设置为 right.
我想为列表制作卡片视图。但我没有得到正确的看法。
我想在左侧显示图像。在图像的右侧我想显示酒店名称、地区、等级、菜系。
但是现在通过这段代码一切都重叠了。
谁能帮帮我?我正在上传图片,我正在使用此代码。
见图片酒店名称、区域、评分、菜式重叠。如何解决这个问题? 这是我想要的通过卡片视图的屏幕截图
.
list_row.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
>
<!--<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/list_row_selector"
android:padding="8dp" >-->
<!-- Thumbnail Image -->
<android.support.v7.widget.CardView
android:id="@+id/ly_root"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FEFEFE"
android:layout_margin="8dp"
app:cardCornerRadius="4dp">
<!--<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="@+id/card_view"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
card_view:cardCornerRadius="4dp">-->
<com.android.volley.toolbox.NetworkImageView
android:id="@+id/thumbnail"
android:layout_width="120dp"
android:layout_height="80dp"
android:scaleType="centerCrop"
android:layout_marginRight="8dp" />
<!-- Restaurant name -->
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/title"
android:textStyle="bold" />
<TextView
android:id="@+id/area"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/name"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<!-- Rating -->
<TextView
android:id="@+id/average_ratings"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/area"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<TextView
android:id="@+id/cuisine"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/average_ratings"
android:textColor="#D2691E"
android:layout_toRightOf="@+id/thumbnail"
android:textSize="@dimen/rating" />
<!-- Genre -->
<!-- <TextView
android:id="@+id/genre"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/rating"
android:layout_marginTop="5dp"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="@color/genre"
android:textSize="@dimen/genre" />-->
<!--
<!– Release Year –>
<TextView
android:id="@+id/releaseYear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textColor="@color/year"
android:textSize="@dimen/year" />-->
</android.support.v7.widget.CardView>
</LinearLayout>
使用 RelativeLayout 的 CardView 子项
<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/ly_root"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:background="#FEFEFE"
app:cardCornerRadius="4dp">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.android.volley.toolbox.NetworkImageView
android:id="@+id/thumbnail"
android:layout_width="120dp"
android:layout_height="80dp"
android:layout_marginRight="8dp"
android:scaleType="centerCrop" />
<!-- Restaurant name -->
<TextView
android:id="@+id/name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="@+id/thumbnail"
android:textStyle="bold" />
<TextView
android:id="@+id/area"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/name"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E"/>
<!-- Rating -->
<TextView
android:id="@+id/average_ratings"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/area"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E" />
<TextView
android:id="@+id/cuisine"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/average_ratings"
android:layout_toRightOf="@+id/thumbnail"
android:textColor="#D2691E" />
</RelativeLayout>
</android.support.v7.widget.CardView>
一般来说,您的 CardView 应该只包含一种布局 - 您之前使用过的 RelativeLayout
。 CardView 本身无法按照您的意愿定位项目。
如果您查看 documentation,您会看到 CardView 扩展了 FrameLayout,它应该只包含一个子项,因此它不能控制 CardView 中的定位。
CardView 就像一个FrameLayout。布局中 cardView 中的后续项目将放置在前一个项目之上。
您可以将 TextView 的 layout_gravity 设置为 "right"。 这不是一个完美的方法。因此,我建议将 TextView 封装在 orientation="vertical" 的线性布局中,并将 LinearLayout 的 layout_gravity 设置为 right.