I would like to create a basic table with 6 rows and 3 columns. The rows represent the days and columns represent morning/evening. The layout I desire to create:
I want to be able to color the nodes (red and green for availability). Also each row is stanched on the whole width of the screen. I have created something similar with TableLayout
:
<TableLayout
android:id="@+id/shifts_table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shrinkColumns="*"
android:stretchColumns="*"
android:layout_marginBottom="10dp">
<TableRow
android:id="@+id/table_row_sunday"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/text_sunday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_sunday"/>
<LinearLayout
android:id="@+id/layout_sunday_morning"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_sunday_morning"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_sunday_morning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_morning"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_sunday_evening"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_sunday_evening"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_sunday_evening"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_evening"/>
</LinearLayout>
</TableRow>
<TableRow
android:id="@+id/table_row_monday"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TextView
android:id="@+id/text_monday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_monday" />
<LinearLayout
android:id="@+id/layout_monday_morning"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_monday_morning"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_monday_morning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_morning"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_monday_evening"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_monday_evening"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_monday_evening"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_evening"/>
</LinearLayout>
</TableRow>
<TableRow
android:id="@+id/table_row_tuesday"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TextView
android:id="@+id/text_tuesday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_tuesday"/>
<LinearLayout
android:id="@+id/layout_tuesday_morning"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_tuesday_morning"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_tuesday_morning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_morning"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_tuesday_evening"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_tuesday_evening"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_tuesday_evening"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_evening"/>
</LinearLayout>
</TableRow>
<TableRow
android:id="@+id/table_row_wednesday"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TextView
android:id="@+id/text_wednesday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_wednesday"/>
<LinearLayout
android:id="@+id/layout_wednesday_morning"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_wednesday_morning"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_wednesday_morning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_morning"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_wednesday_evening"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_wednesday_evening"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_wednesday_evening"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_evening" />
</LinearLayout>
</TableRow>
<TableRow
android:id="@+id/table_row_thursday"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<TextView
android:id="@+id/text_thursday"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_thursday"/>
<LinearLayout
android:id="@+id/layout_thursday_morning"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_thursday_morning"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_thursday_morning"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_morning"/>
</LinearLayout>
<LinearLayout
android:id="@+id/layout_thursday_evening"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<CheckBox
android:id="@+id/checkbox_thursday_evening"
android:layout_height="wrap_content"
android:drawSelectorOnTop="true"
android:clickable="false"
android:layout_width="wrap_content" />
<TextView
android:id="@+id/text_thursday_evening"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/form_evening" />
</LinearLayout>
</TableRow>
</TableLayout>
I have checkboxes (instead of nodes to fill). I tried to convert the TableLayout
to GridLayout
(without checkboxes) but it looks like not a trivial mission. From this topic I learn it is not easy to starch the rows. What would be the easiest way of creating such table with Grid
with API 16?