单个片段中的 GridView 和 ListView

Question

我正在做Android购物申请。我需要将产品显示为网格以及这样的列表：

https://lh6.ggpht.com/Ly21pAbBRIxAzHn2R119a37NexxtjG5RkQJV8vv0IoCywzksIhKNSCkzWikbUnH8bGY=h900-rw

我不知道如何使用图像按钮或标签来执行此操作。我可以在运行时更改片段的布局吗？或者我使用了 2 个不同的片段？请帮助我。

Answer 1

您有多个选择：

使用 RecyclerView
有两个不同的片段
有两种不同的布局
使用框架布局并切换子视图的可见性
使用 ViewFlipper 或 ViewSwitcher

Answer 2

看看这个：

xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="1"
    android:orientation="horizontal" >

    <LinearLayout
        android:id="@+id/tlist"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center" >

        <TextView
            android:id="@+id/textview1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="ListView"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="@color/white" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/tgrid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center" >

        <TextView
            android:id="@+id/textview2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="GridView"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="@color/white" />
    </LinearLayout>
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_weight="0.1" >

    <LinearLayout
        android:id="@+id/gridid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:visibility="gone" >

        <GridView
            android:id="@+id/gridView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:horizontalSpacing="5dp"
            android:numColumns="2"
            android:verticalSpacing="5dp" >
        </GridView>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/listid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1" >

        <ListView
            android:id="@+id/listView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:dividerHeight="10sp" >
        </ListView>
    </LinearLayout>
</LinearLayout>

</LinearLayout>

MainActivity.java

import java.io.BufferedReader;
import java.io.IOException;
import java.io.InputStreamReader;
import java.util.ArrayList;

import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

import com.example.Adapter.FriendAdapter;
import com.example.bean.FriendBean;

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Color;
import android.util.Log;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.GridView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;

public class MainActivity extends Activity {
private ListView mlist;
private GridView mgrid;
private ArrayList<FriendBean> arr = new ArrayList<FriendBean>();
private FriendAdapter friendAdapter1, friendAdapter2;
private int slist = R.layout.list;
private int sgrid = R.layout.grid;
private TextView list, grid;
LinearLayout listid, gridid, tlist, tgrid;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    mlist = (ListView) findViewById(R.id.listView1);
    mgrid = (GridView) findViewById(R.id.gridView1);
    list = (TextView) findViewById(R.id.textview1);
    grid = (TextView) findViewById(R.id.textview2);
    listid = (LinearLayout) findViewById(R.id.listid);
    gridid = (LinearLayout) findViewById(R.id.gridid);
    tlist = (LinearLayout) findViewById(R.id.tlist);
    tgrid = (LinearLayout) findViewById(R.id.tgrid);

    StringBuffer sb = new StringBuffer();
    BufferedReader br = null;

    try {
        br = new BufferedReader(new InputStreamReader(getAssets().open(
                "listgrid.json")));
        String temp;
        while ((temp = br.readLine()) != null)
            sb.append(temp);
    } catch (IOException e1) {
        // TODO Auto-generated catch block
        e1.printStackTrace();
    } finally {
        try {
            br.close(); // stop reading
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
    String myjsonstring = sb.toString();

    try {
        JSONObject obj = new JSONObject(myjsonstring);
        JSONArray jsonarray = obj.getJSONArray("lg");
        Log.e("Length", "" + jsonarray.length());
        for (int i = 0; i < jsonarray.length(); i++) {
            JSONObject jsonObj = jsonarray.getJSONObject(i);
            String num = jsonObj.getString("number");
            String url = jsonObj.getString("image_url");
            FriendBean bean = new FriendBean(url, num);
            arr.add(bean);
            Log.e("image_url", url);
            Log.e("number", num);
        }

    } catch (JSONException e) {
        // TODO Auto-generated catch block
        e.printStackTrace();
    }
    tlist.setBackgroundColor(Color.RED);
    tgrid.setBackgroundColor(Color.BLACK);
    friendAdapter1 = new FriendAdapter(MainActivity.this, slist, arr);
    mlist.setAdapter(friendAdapter1);

/*****JUST LOOK AT THIS****/
    list.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            gridid.setVisibility(View.GONE);
            listid.setVisibility(View.VISIBLE);
            tlist.setBackgroundColor(Color.RED);
            tgrid.setBackgroundColor(Color.BLACK);
            friendAdapter1 = new FriendAdapter(MainActivity.this, slist, arr);
            mlist.setAdapter(friendAdapter1);
        }
    });

/*****JUST LOOK AT THIS****/
    grid.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            gridid.setVisibility(View.VISIBLE);
            listid.setVisibility(View.GONE);
            tgrid.setBackgroundColor(Color.RED);
            tlist.setBackgroundColor(Color.BLACK);
            friendAdapter2 = new FriendAdapter(MainActivity.this, sgrid, arr);
            mgrid.setAdapter(friendAdapter2);
        }
    });
}

}

Answer 3

当您可以简单地使用 RecyclerView 并使用图像按钮来处理点击并且在点击时您可以使用类似这样的东西时，为什么要使用两种布局

// The number of Columns
mLayoutManager = new GridLayoutManager(this, 2);
mRecyclerView.setLayoutManager(mLayoutManager);

单击列表按钮时，您可以使用如下内容：

mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);

我不确定它是否有效，这只是一个例子，如果您想了解更多关于使用 RecyclerView 和 CardView 实现网格和列表的信息，请查看我制作的这些教程：

Custom Android lists with CardView and RecyclerView

Custom Android Grids with Images and Texts using RecyclerView

单个片段中的 GridView 和 ListView

GridView and ListView in a single fragment

android

listview

gridview

android-fragments