像给定图像一样创建交错网格

时间:2017-04-14 11:51:12

标签: android android-layout

我正在努力实现这个观点:

enter image description here

这是局部视图,我可以将视图垂直合并2个单元格或水平合并2个单元格或单个小视图。

此视图可以垂直滚动

请帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

您可以使用带有属性`<%@ ServiceHost Language="C#" Debug="true" Service="SAGBService.SAGBService"%`> LinearLayout的嵌套layout_weight来创建此布局。要制作此布局weightSum,请使用scrollable作为根布局。

以下是一个工作示例:

ScrollView

<强>输出:

enter image description here

您还可以使用<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="8dp" android:orientation="vertical"> <!-- ROW1 --> <LinearLayout android:layout_width="match_parent" android:layout_height="100dp" android:background="#ff0000"> </LinearLayout> <!-- ROW2 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:orientation="horizontal" android:weightSum="2"> <!-- ROW2 COL1--> <LinearLayout android:layout_width="match_parent" android:layout_height="200dp" android:layout_marginRight="4dp" android:layout_weight="1" android:background="#00ff00"> </LinearLayout> <!-- ROW2 COL2--> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="4dp" android:orientation="vertical" android:layout_weight="1" android:weightSum="2"> <!-- ROW2 COL2 CHILD1--> <LinearLayout android:layout_width="match_parent" android:layout_height="96dp" android:layout_marginBottom="4dp" android:layout_weight="1" android:background="#0000ff"> </LinearLayout> <!-- ROW2 COL2 CHILD2--> <LinearLayout android:layout_width="match_parent" android:layout_height="96dp" android:layout_marginTop="4dp" android:layout_weight="1" android:background="#0000ff"> </LinearLayout> </LinearLayout> </LinearLayout> <!-- ROW3 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:orientation="horizontal" android:weightSum="2"> <!-- ROW3 COL1--> <LinearLayout android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginRight="4dp" android:layout_weight="1" android:background="#fff000"> </LinearLayout> <!-- ROW3 COL2--> <LinearLayout android:layout_width="match_parent" android:layout_height="100dp" android:layout_marginLeft="4dp" android:layout_weight="1" android:background="#fff000"> </LinearLayout> </LinearLayout> <!-- ROW4 --> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:orientation="horizontal" android:weightSum="2"> <!-- ROW4 COL1--> <LinearLayout android:layout_width="match_parent" android:layout_height="200dp" android:layout_marginRight="4dp" android:layout_weight="1" android:background="#ff00ff"> </LinearLayout> <!-- ROW4 COL2--> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="4dp" android:orientation="vertical" android:layout_weight="1" android:weightSum="2"> <!-- ROW4 COL2 CHILD1--> <LinearLayout android:layout_width="match_parent" android:layout_height="96dp" android:layout_marginBottom="4dp" android:layout_weight="1" android:background="#00ffff"> </LinearLayout> <!-- ROW4 COL2 CHILD2--> <LinearLayout android:layout_width="match_parent" android:layout_height="96dp" android:layout_marginTop="4dp" android:layout_weight="1" android:background="#00ffff"> </LinearLayout> </LinearLayout> </LinearLayout> </LinearLayout> </ScrollView> 来实现此观点。

这是关于GridLayout和一些stackOverflow tutorial的好answers

希望这会有所帮助〜