[Android] Redesign of the video list/grid

Ludovic Fauvet git at videolan.org
Mon Oct 8 23:15:06 CEST 2012


vlc-ports/android | branch: master | Ludovic Fauvet <etix at videolan.org> | Sat Oct  6 03:58:18 2012 +0200| [1e0bc687836ba9dfc0e5232320e3cad2482f39a5] | committer: Ludovic Fauvet

Redesign of the video list/grid

> http://git.videolan.org/gitweb.cgi/vlc-ports/android.git/?a=commit;h=1e0bc687836ba9dfc0e5232320e3cad2482f39a5
---

 vlc-android/assets/licence.htm                       |    4 ++++
 vlc-android/res/drawable/background_pattern_dark.png |  Bin 0 -> 22749 bytes
 .../res/drawable/background_pattern_dark_repeat.xml  |    4 ++++
 vlc-android/res/layout/video_grid.xml                |    7 ++++++-
 vlc-android/res/layout/video_grid_item.xml           |   18 +++++++++---------
 vlc-android/res/layout/video_list_item.xml           |    6 +++---
 .../videolan/vlc/gui/video/VideoGridFragment.java    |    4 ++--
 .../org/videolan/vlc/gui/video/VideoListAdapter.java |    4 ++--
 8 files changed, 30 insertions(+), 17 deletions(-)

diff --git a/vlc-android/assets/licence.htm b/vlc-android/assets/licence.htm
index 9b18979..6e37940 100644
--- a/vlc-android/assets/licence.htm
+++ b/vlc-android/assets/licence.htm
@@ -54,6 +54,10 @@
             <li>Zlib - Copyright © 1995-2012 Jean-loup Gailly and Mark Adler - <a href="http://zlib.net/zlib_license.html">zlib licence</a></li>
         </ul>
         </p>
+      <h2>Graphics</h2>
+      <ul>
+          <li>Background pattern - Copyright © 2012 Jordan Pittman - <a href="http://creativecommons.org/licenses/by-sa/3.0/">Creative Commons BY-SA 3.0</a></li>
+      </ul>
       </div>
         <p><a href="#top">Back to the top</a></p>
       <hr />
diff --git a/vlc-android/res/drawable/background_pattern_dark.png b/vlc-android/res/drawable/background_pattern_dark.png
new file mode 100644
index 0000000..17b491e
Binary files /dev/null and b/vlc-android/res/drawable/background_pattern_dark.png differ
diff --git a/vlc-android/res/drawable/background_pattern_dark_repeat.xml b/vlc-android/res/drawable/background_pattern_dark_repeat.xml
new file mode 100644
index 0000000..e7296a9
--- /dev/null
+++ b/vlc-android/res/drawable/background_pattern_dark_repeat.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
+        android:src="@drawable/background_pattern_dark"
+        android:tileMode="repeat" />
\ No newline at end of file
diff --git a/vlc-android/res/layout/video_grid.xml b/vlc-android/res/layout/video_grid.xml
index c617eec..1471102 100644
--- a/vlc-android/res/layout/video_grid.xml
+++ b/vlc-android/res/layout/video_grid.xml
@@ -8,11 +8,16 @@
         android:id="@id/android:list"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
+        android:paddingLeft="20dip"
+        android:paddingRight="20dip"
+        android:scrollbarStyle="outsideInset"
         android:numColumns="auto_fit"
         android:fastScrollEnabled="true"
         android:horizontalSpacing="20dp"
         android:verticalSpacing="20dp"
-        android:stretchMode="spacingWidthUniform" />
+        android:stretchMode="spacingWidth"
+        android:background="@drawable/background_pattern_dark_repeat"
+        android:gravity="center" />
 
     <LinearLayout
         android:id="@id/android:empty"
diff --git a/vlc-android/res/layout/video_grid_item.xml b/vlc-android/res/layout/video_grid_item.xml
index a067d7a..96e4fd2 100644
--- a/vlc-android/res/layout/video_grid_item.xml
+++ b/vlc-android/res/layout/video_grid_item.xml
@@ -2,20 +2,20 @@
 <LinearLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:id="@+id/layout_item"
-    android:layout_width="150dip"
+    android:layout_width="156dip"
     android:layout_height="150dip"
     android:orientation="vertical"
-    android:gravity="center_vertical"
-    android:background="#444">
+    android:gravity="center_vertical">
     <ImageView
         android:id="@+id/ml_item_thumbnail"
-        android:layout_width="120dip"
-        android:layout_height="80dip"
+        android:layout_width="156dip"
+        android:layout_height="104dip"
         android:scaleType="centerCrop"
-        android:layout_gravity="center_horizontal" />
+        android:layout_gravity="center_horizontal"
+        android:background="@android:color/black" />
     <LinearLayout
         android:layout_width="fill_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="0dp"
         android:layout_weight="1"
         android:orientation="vertical">
         <TextView
@@ -26,13 +26,13 @@
             android:ellipsize="end"
             android:maxLines="2"
             android:textSize="12dip"
-            android:textColor="@android:color/white" />
+            android:textColor="@color/list_title" />
         <TextView
             android:id="@+id/ml_item_subtitle"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:gravity="center_horizontal"
             android:textSize="10dip"
-            android:textColor="@android:color/white" />
+            android:textColor="@color/list_subtitle" />
     </LinearLayout>
 </LinearLayout>
\ No newline at end of file
diff --git a/vlc-android/res/layout/video_list_item.xml b/vlc-android/res/layout/video_list_item.xml
index 5a6fc36..bb8e36e 100644
--- a/vlc-android/res/layout/video_list_item.xml
+++ b/vlc-android/res/layout/video_list_item.xml
@@ -10,11 +10,11 @@
         android:id="@+id/ml_item_thumbnail"
         android:layout_width="120dip"
         android:layout_height="80dip"
-        android:scaleType="centerCrop" />
+        android:scaleType="centerCrop"
+        android:background="@android:color/black" />
     <LinearLayout
-        android:layout_width="0dip"
+        android:layout_width="wrap_content"
         android:layout_height="wrap_content"
-        android:layout_weight="1"
         android:orientation="vertical">
         <TextView
             android:id="@+id/ml_item_title"
diff --git a/vlc-android/src/org/videolan/vlc/gui/video/VideoGridFragment.java b/vlc-android/src/org/videolan/vlc/gui/video/VideoGridFragment.java
index 3708b0e..9681956 100644
--- a/vlc-android/src/org/videolan/vlc/gui/video/VideoGridFragment.java
+++ b/vlc-android/src/org/videolan/vlc/gui/video/VideoGridFragment.java
@@ -104,14 +104,14 @@ public class VideoGridFragment extends SherlockGridFragment implements ISortable
         if (android.os.Build.VERSION.SDK_INT >= 11)
             columns = gv.getNumColumns();
 
+        float density = getResources().getDisplayMetrics().density;
         if (columns == 1) {
             gv.setNumColumns(1);
             gv.setStretchMode(GridView.STRETCH_COLUMN_WIDTH);
             gv.setHorizontalSpacing(0);
-            gv.setVerticalSpacing(0);
+            gv.setVerticalSpacing((int) (10 * density + 0.5f));
             mVideoAdapter.setListMode(true);
         } else {
-            float density = getResources().getDisplayMetrics().density;
             gv.setColumnWidth((int) (150 * density + 0.5f));
         }
 
diff --git a/vlc-android/src/org/videolan/vlc/gui/video/VideoListAdapter.java b/vlc-android/src/org/videolan/vlc/gui/video/VideoListAdapter.java
index bcfcad9..1e77529 100644
--- a/vlc-android/src/org/videolan/vlc/gui/video/VideoListAdapter.java
+++ b/vlc-android/src/org/videolan/vlc/gui/video/VideoListAdapter.java
@@ -145,11 +145,11 @@ public class VideoListAdapter extends ArrayAdapter<Media>
             holder = (ViewHolder) v.getTag();
 
         Media media = getItem(position);
-        //Util.setItemBackground(holder.layout, position);
         holder.title.setText(media.getTitle());
 
         Bitmap thumbnail;
         if (media.getPicture() != null) {
+            //FIXME Warning: the thumbnails are upscaled in the grid view!
             thumbnail = media.getPicture();
             holder.thumbnail.setImageBitmap(thumbnail);
         } else {
@@ -161,7 +161,7 @@ public class VideoListAdapter extends ArrayAdapter<Media>
         ColorStateList titleColor = v.getResources().getColorStateList(media.getLocation().equals(mLastMRL)
                 ? R.color.list_title_last
                 : R.color.list_title);
-        //holder.title.setTextColor(titleColor);
+        holder.title.setTextColor(titleColor);
 
         long lastTime = media.getTime();
         String text;



More information about the Android mailing list