如何使用合并列创建 2 列布局？

Question

如何在android中创建这种布局 我试过使用表格布局。但在创建这个时出错。 请检查我的代码我能够显示图像。 1 行中的 1 张图像。但我想要 1 行中的 2 个小图像。并继续。

这是我的代码

private void getBannerList() {

    final Call<BannerList_Model> itemMainResponse = APIHandler.getApiService().bannerList(getFiledMapForItemList());

    itemMainResponse.enqueue(new Callback<BannerList_Model>() {
        @Override
        public void onResponse(Response<BannerList_Model> response, Retrofit retrofit) {
            BannerList_Model itemResponse = null;
            itemResponse = response.body();

            if (itemResponse == null) {
                UIUtils.showToast(getContext(), "Server Error !");
            } else {
                String msg = itemResponse.getMsg().toString();
                if (msg.equals("success")) {
                    userList = itemResponse.getBannerList();
                    if(userList != null) {
                        TableLayout table = (TableLayout) view.findViewById(R.id.tblBanner_list);
                        table.setColumnStretchable(0,true);
                        table.setColumnStretchable(1,true);

                        int tsize = userList.size();
                        TextView[] t1 = new TextView[tsize];
                        ImageView[] img = new ImageView[tsize];

                        for(int i=0; i<userList.size();i++)
                        {
                            TableRow row = new TableRow(getContext());
                            String banner_size = userList.get(i).getBannerSize().toString();


                                img[i] = new ImageView(getContext());
                                Picasso.with(getContext())
                                        .load(Constants.VIDEO_URL + userList.get(i).getBannerUrl())
                                        .into(img[i]);

                                row.addView(img[i]);

                                table.addView(row);

                        }
                    }
                } 
            }
        }
        }
    });
}

这是我想要布局的视频 http://shrivivah.com/layout.mp4

如果有 2 个小图像，它将显示在 1 行中。 如果有 2 张中等或全尺寸图像，则每张将显示 1 行。 如果每行显示 1 个小图像和 2 个中图像而不是 1 个图像。

布局图片

Answer 1

您的错误是您将TextView 添加到TableRow(row) 但您没有将行添加到TableLayout。这是您需要的示例。您可以设置一些边距并添加按钮。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:orientation="vertical">

<TableLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1">

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <TextView
            android:id="@+id/textView3"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="TextView" />

        <TextView
            android:id="@+id/textView2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="TextView" />

    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <TextView
            android:id="@+id/textView4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView" />
    </TableRow>

</TableLayout>

<TableLayout
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="1">

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView
            android:id="@+id/textView5"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="TextView" />

    </TableRow>

</TableLayout>

</LinearLayout>

Answer 2

 <?xml version="1.0" encoding="utf-8"?>
   <LinearLayout 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="match_parent"
    android:orientation="vertical"
    tools:context="com.example.tops.stackoverflow.MainActivity">

<LinearLayout
    android:id="@+id/llShortcutParent"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:duplicateParentState="true"
    android:elevation="20dp"
    android:padding="10dp"
    android:orientation="horizontal">


    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"
        android:layout_weight="1"/>


    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"
        android:layout_weight="1"/>
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:duplicateParentState="true"
    android:elevation="20dp"
    android:padding="10dp"
    android:orientation="horizontal">


    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button1"

        android:layout_weight="1"/>


</LinearLayout>
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:duplicateParentState="true"
    android:elevation="20dp"
    android:padding="10dp"
    android:orientation="horizontal">


    <Button
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Button1"
        android:layout_weight="1"/>


    <Button
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="Button1"
        android:layout_weight="1"/>
</LinearLayout>

</LinearLayout>