Make the color picker scale with display density

The UberColorPickerDialog was written when there was only one display
density (mdpi). Scale all of the values appropriately for modern
multi-density displays.

Fixes #64

2 files changed, 35 insertions, 33 deletions

diff --git a/res/layout/act_colors.xml b/res/layout/act_colors.xml
index 625437d..dfb6082 100644
--- a/res/layout/act_colors.xml
+++ b/res/layout/act_colors.xml
@@ -23,36 +23,35 @@
 	android:layout_width="fill_parent"
 	android:layout_height="fill_parent">
 
-	<TextView
-		android:text="@string/colors_fg"
-		android:layout_height="wrap_content"
-		android:layout_width="wrap_content"
-		android:id="@+id/fg_label"
-		android:paddingTop="12dp"
-		/>
-
-	<Spinner
-		android:id="@+id/fg"
-		android:layout_width="wrap_content"
+	<LinearLayout
+		android:orientation="horizontal"
+		android:layout_width="fill_parent"
 		android:layout_height="wrap_content"
-		android:layout_toRightOf="@+id/fg_label"
-		/>
+		android:id="@+id/spinners">
 
-	<Spinner
-		android:id="@+id/bg"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
-		android:layout_alignTop="@+id/fg"
-		android:layout_alignParentRight="true"
-		/>
+		<Spinner
+			android:id="@+id/fg"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_alignParentLeft="true"
+			android:minHeight="60dp"
+			android:layout_weight="1"
+			android:gravity="center"
+			/>
 
-	<TextView
-		android:text="@string/color_bg"
-		android:layout_height="wrap_content"
-		android:layout_width="wrap_content"
-		android:layout_toLeftOf="@+id/bg"
-		android:paddingTop="12dp"
-		/>
+		<Spinner
+			android:id="@+id/bg"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_alignTop="@id/fg"
+			android:layout_alignParentRight="true"
+			android:layout_toRightOf="@id/fg"
+			android:layout_alignParentStart="true"
+			android:minHeight="60dp"
+			android:layout_weight="1"
+			android:gravity="center"
+			/>
+	</LinearLayout>
 
 	<GridView
 		android:id="@+id/color_grid"
@@ -65,7 +64,8 @@
 		android:columnWidth="60dp"
 		android:stretchMode="columnWidth"
 		android:gravity="center"
-		android:layout_below="@+id/fg"
-		android:stackFromBottom="true" android:minHeight="60dp"/>
+		android:minHeight="60dp"
+		android:layout_below="@+id/spinners"
+		/>
 
 </RelativeLayout>
diff --git a/res/values/strings.xml b/res/values/strings.xml
index 552cd05..87206cf 100644
--- a/res/values/strings.xml
+++ b/res/values/strings.xml
@@ -37,6 +37,8 @@
 	<string name="title_help">"Help"</string>
 	<!-- Window title for color list editing screen -->
 	<string name="title_colors">"Colors"</string>
+	<!-- Dialog title for color picker dialog -->
+	<string name="title_color_picker">"Pick a color"</string>
 
 	<string name="resolve_connect">"Connect"</string>
 	<!-- Menu selection where user must move finger randomly over an area to gather entropy (collect random bits) -->
@@ -481,11 +483,11 @@
 	<string name="color_blue">"blue"</string>
 	<string name="color_gray">"gray"</string>
 
-	<!-- Very short label indicating the thing next to it is "foreground color." -->
-	<string name="colors_fg">"FG":</string>
+	<!-- Very short label indicating the number next to it is "foreground color" number. -->
+	<string name="colors_fg_label">"FG: %1$d"</string>
 
-	<!-- Very short label indicating the thing next to it is "background color." -->
-	<string name="color_bg">"BG:"</string>
+	<!-- Very short label indicating the number next to it is "background color" number. -->
+	<string name="color_bg_label">"BG: %1$d"</string>
 
 	<!-- Describes the image of the "connected to host" icon for accessibility purposes. -->
 	<string name="image_description_connected">"Connected."</string>