Style the host list items with material design.

This change updates the items to be in line with the guideline here: https://www.google.com/design/spec/components/lists.html#lists-specs.

3 files changed, 59 insertions, 30 deletions

diff --git a/app/src/main/res/layout-land/item_host.xml b/app/src/main/res/layout-land/item_host.xml
index cbccd91..a6e60d3 100644
--- a/app/src/main/res/layout-land/item_host.xml
+++ b/app/src/main/res/layout-land/item_host.xml
@@ -23,23 +23,30 @@
 	xmlns:android="http://schemas.android.com/apk/res/android"
 	android:layout_width="fill_parent"
 	android:layout_height="wrap_content"
-	android:padding="10dip"
+	android:minHeight="72dp"
 	>
 
 	<ImageView
 		android:id="@android:id/icon"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
+		android:layout_width="40dp"
+		android:layout_height="40dp"
 		android:layout_alignParentRight="true"
+		android:layout_centerVertical="true"
+		android:layout_marginRight="16dp"
 		android:contentDescription="@string/image_description_connected"
-		android:paddingTop="5dip"
 		android:src="@drawable/connected"
 		/>
 
 	<LinearLayout
-		android:layout_width="fill_parent"
+		android:layout_width="wrap_content"
 		android:layout_height="wrap_content"
-		android:orientation="horizontal"
+		android:layout_alignParentLeft="true"
+		android:layout_alignWithParentIfMissing="true"
+		android:layout_centerVertical="true"
+		android:layout_marginLeft="16dp"
+		android:layout_marginRight="16dp"
+		android:orientation="vertical"
+		android:layout_toLeftOf="@android:id/icon"
 		>
 
 		<TextView
@@ -48,18 +55,18 @@
 			android:layout_height="wrap_content"
 			android:ellipsize="end"
 			android:singleLine="true"
-			android:textAppearance="?android:attr/textAppearanceLarge"
+			android:paddingTop="20dp"
+			android:textAppearance="@style/ListItemFirstLineText"
 			/>
 
 		<TextView
 			android:id="@android:id/text2"
 			android:layout_width="wrap_content"
 			android:layout_height="wrap_content"
-			android:paddingLeft="10dip"
-			android:textAppearance="?android:attr/textAppearanceSmall"
+			android:paddingBottom="20dp"
+			android:textAppearance="@style/ListItemSecondLineText"
 			/>
 
-
 	</LinearLayout>
 
-</RelativeLayout>
\ No newline at end of file
+</RelativeLayout>
diff --git a/app/src/main/res/layout-port/item_host.xml b/app/src/main/res/layout-port/item_host.xml
index 7ee7f0a..c318d38 100644
--- a/app/src/main/res/layout-port/item_host.xml
+++ b/app/src/main/res/layout-port/item_host.xml
@@ -22,36 +22,50 @@
 	xmlns:android="http://schemas.android.com/apk/res/android"
 	android:layout_width="fill_parent"
 	android:layout_height="wrap_content"
-	android:padding="10dip"
+	android:minHeight="72dp"
 	>
 
 	<ImageView
 		android:id="@android:id/icon"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
+		android:layout_width="40dp"
+		android:layout_height="40dp"
 		android:layout_alignParentRight="true"
+		android:layout_centerVertical="true"
+		android:layout_marginRight="16dp"
 		android:contentDescription="@string/image_description_connected"
-		android:paddingTop="5dip"
 		android:src="@drawable/connected"
 		/>
 
-	<TextView
-		android:id="@android:id/text1"
+	<LinearLayout
 		android:layout_width="wrap_content"
 		android:layout_height="wrap_content"
-		android:ellipsize="end"
-		android:paddingRight="20dip"
-		android:singleLine="true"
-		android:textAppearance="?android:attr/textAppearanceLarge"
-		/>
+		android:layout_alignParentLeft="true"
+		android:layout_alignWithParentIfMissing="true"
+		android:layout_centerVertical="true"
+		android:layout_marginLeft="16dp"
+		android:layout_marginRight="16dp"
+		android:orientation="vertical"
+		android:layout_toLeftOf="@android:id/icon"
+		>
 
-	<TextView
-		android:id="@android:id/text2"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
-		android:layout_below="@android:id/text1"
-		android:textAppearance="?android:attr/textAppearanceSmall"
-		/>
+		<TextView
+			android:id="@android:id/text1"
+			android:layout_width="wrap_content"
+			android:layout_height="wrap_content"
+			android:ellipsize="end"
+			android:singleLine="true"
+			android:paddingTop="20dp"
+			android:textAppearance="@style/ListItemFirstLineText"
+			/>
+
+		<TextView
+			android:id="@android:id/text2"
+			android:layout_width="wrap_content"
+			android:layout_height="wrap_content"
+			android:paddingBottom="20dp"
+			android:textAppearance="@style/ListItemSecondLineText"
+			/>
 
+	</LinearLayout>
 
 </RelativeLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index 031d358..593af85 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -27,9 +27,17 @@
 		<item name="android:textSize">10sp</item>
 	</style>
 
-
 	<style name="KeyboardButton" parent="KeyboardKey">
 		<item name="android:background">@drawable/keyboard_button_selector</item>
 	</style>
 
+	<style name="ListItemFirstLineText" parent="TextAppearance.AppCompat">
+		<item name="android:textColor">?android:textColorPrimary</item>
+		<item name="android:textSize">16sp</item>
+	</style>
+
+	<style name="ListItemSecondLineText" parent="TextAppearance.AppCompat">
+		<item name="android:textColor">?android:textColorSecondary</item>
+		<item name="android:textSize">14sp</item>
+	</style>
 </resources>