android - 使用多列自定义布局在 Android 中显示产品列表

Question

我想在我的 android 应用程序中展示一些产品，我需要它是动态的，

我需要以下要求:

• 在 GridView 中显示产品(2、3 或 4 列，具体取决于手机、平板电脑、纵向、横向模式)
• 每个产品都有 onclick 事件(以在另一个 Activity/fragment 中显示产品的详细信息)
• 网格上的每个产品都应该来自 xml 布局(包含缩略图、标题、价格等)
• 在滚动中加载更多产品(load on scroll)
• 使用 json 从网络上的 sqlserver 数据库加载产品(可以使用适配器来完成...)

我应该提一下，我已经搜索了 android 库并且找到了 cardslib ，但我不明白如何将这些要求与这个库结合起来!我知道有些要求很容易处理，但我不知道如何将所有要求放在一起!

为了澄清情况，我从类似的应用程序上传了一些图片:

提前感谢任何解决方案。

Answer 1

这是单个 GridView 。

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

android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#e6e6e6"
android:orientation="vertical"
android:padding="1dp">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#ffffff"
        android:orientation="vertical"
        android:padding="1.5dp">

        <ImageView
            android:id="@+id/picture"
            android:layout_width="150dp"
            android:layout_height="250dp"
            android:layout_gravity="top|center"
            android:padding="5dp"
            android:src="@drawable/productcimage" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1.5dp"
            android:background="#e6e6e6" />

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|center_horizontal">

            <TextView
                android:id="@+id/textView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_marginTop="2dp"
                android:text="New Text" />

            <TextView
                android:id="@+id/textView2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:layout_alignParentRight="true"
                android:layout_alignParentTop="true"
                android:text="New Text" />

            <TextView
                android:id="@+id/textView3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_below="@+id/textView2"
                android:text="New Text" />

            <RatingBar
                android:id="@+id/ratingBar"
                style="@style/Widget.AppCompat.RatingBar.Small"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:layout_alignParentRight="true"
                android:layout_below="@+id/textView2"
                android:rating="3" />

        </RelativeLayout>
    </LinearLayout>
</LinearLayout>