Update

app/src/main/java/com/hippo/ehviewer/ui/fragment/GalleryListFragment.java

@@ -15,5 +15,7 @@
 
 package com.hippo.ehviewer.ui.fragment;
 
-public class GalleryListFragment extends SceneFragment {
+import android.support.v4.app.Fragment;
+
+public class GalleryListFragment extends Fragment {
 }

app/src/main/java/com/hippo/ehviewer/ui/fragment/SceneFragment.java

@@ -1,33 +0,0 @@
-/*
- * Copyright (C) 2015 Hippo Seven
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-package com.hippo.ehviewer.ui.fragment;
-
-import android.support.v4.app.Fragment;
-
-import com.hippo.scene.Scene;
-
-public class SceneFragment extends Fragment {
-
-    private Scene mScene;
-
-    public Scene getScene() {
-        return mScene;
-    }
-
-    public void setScene(Scene scene) {
-        mScene = scene;
-    }
-}

app/src/main/java/com/hippo/ehviewer/ui/fragment/SearchFragment.java

@@ -22,6 +22,7 @@ import android.net.Uri;
 import android.os.Bundle;
 import android.os.Parcelable;
 import android.provider.MediaStore;
+import android.support.v4.app.Fragment;
 import android.util.SparseArray;
 import android.view.LayoutInflater;
 import android.view.View;
@@ -32,20 +33,22 @@ import com.hippo.ehviewer.data.GalleryListUrlBuilder;
 import com.hippo.ehviewer.widget.SearchLayout;
 import com.hippo.scene.Scene;
 
-public class SearchFragment extends SceneFragment implements SearchLayout.SearhLayoutHelper,
+public class SearchFragment extends Fragment implements SearchLayout.SearhLayoutHelper,
         Scene.ActivityResultListener {
 
     private static final String VIEW_STATE_TAG = "android:view_state";
 
     private Activity mActivity;
 
-    private OnSearchListener mOnSearchListener;
-
     private View mRootView;
     private SearchLayout mSearchLayout;
 
-    public void setOnSearchListener(OnSearchListener listener) {
-        mOnSearchListener = listener;
+    private static Scene sScene;
+    private static OnSearchListener sOnSearchListener;
+
+
+    public static void setScene(Scene scene) {
+        sScene = scene;
     }
 
     @Override
@@ -80,9 +83,9 @@ public class SearchFragment extends SceneFragment implements SearchLayout.SearhL
     }
 
     @Override
-    public void requestSelectImage() {
+    public void onRequestSelectImage() {
         Intent intent = new Intent(Intent.ACTION_PICK, android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
-        getScene().startActivityForResult(intent, this);
+        sScene.startActivityForResult(intent, this);
     }
 
     @Override

app/src/main/java/com/hippo/ehviewer/ui/scene/GalleryListScene.java

@@ -15,6 +15,7 @@
 
 package com.hippo.ehviewer.ui.scene;
 
+import android.content.res.Resources;
 import android.os.Bundle;
 import android.support.v4.app.Fragment;
 import android.support.v4.app.FragmentManager;
@@ -30,6 +31,8 @@ import com.hippo.widget.Appbar;
 
 public class GalleryListScene extends Scene implements SearchFragment.OnSearchListener {
 
+    private Resources mResources;
+
     private Appbar mAppbar;
     private ViewPager mViewPager;
 
@@ -39,13 +42,17 @@ public class GalleryListScene extends Scene implements SearchFragment.OnSearchLi
     public void onCreate() {
         setContentView(R.layout.scene_gallery_list);
 
+        mResources = getStageActivity().getResources();
+
         mAppbar = (Appbar) findViewById(R.id.appbar);
         mViewPager = (ViewPager) findViewById(R.id.viewPager);
 
         mAdapter = new GalleryListPagerAdapter(getSupportFragmentManager());
         mViewPager.setAdapter(mAdapter);
 
-        mAppbar.setTitle("EhViewer");
+        mAppbar.setTitle(mResources.getString(R.string.app_name));
+
+        SearchFragment.setScene(this);
     }
 
     @Override
@@ -61,6 +68,8 @@ public class GalleryListScene extends Scene implements SearchFragment.OnSearchLi
     @Override
     public void onDestroy() {
         dispatchRemove();
+
+        SearchFragment.setScene(null);
     }
 
     @Override
@@ -93,12 +102,9 @@ public class GalleryListScene extends Scene implements SearchFragment.OnSearchLi
         public Fragment getItem(int i) {
             if (i == 0) {
                 SearchFragment fragment = new SearchFragment();
-                fragment.setScene(GalleryListScene.this);
-                fragment.setOnSearchListener(GalleryListScene.this);
                 return fragment;
             } else {
                 GalleryListFragment fragment = new GalleryListFragment();
-                fragment.setScene(GalleryListScene.this);
                 return fragment;
             }
         }

app/src/main/java/com/hippo/ehviewer/widget/SearchLayout.java

@@ -18,7 +18,6 @@ package com.hippo.ehviewer.widget;
 import android.content.Context;
 import android.content.res.Resources;
 import android.graphics.Bitmap;
-import android.graphics.BitmapFactory;
 import android.os.Bundle;
 import android.os.Parcelable;
 import android.support.v7.widget.LinearLayoutManager;
@@ -32,7 +31,6 @@ import android.view.ViewGroup;
 import android.widget.CheckBox;
 import android.widget.CompoundButton;
 import android.widget.FrameLayout;
-import android.widget.ImageView;
 import android.widget.TextView;
 
 import com.hippo.effect.ripple.RippleSalon;
@@ -46,7 +44,7 @@ import com.hippo.widget.recyclerview.EasyRecyclerView;
 import org.jetbrains.annotations.NotNull;
 
 public class SearchLayout extends FrameLayout implements CompoundButton.OnCheckedChangeListener,
-        View.OnClickListener {
+        View.OnClickListener, SelectSearchImageLayout.SelectSearchImageLayoutHelper {
 
     private static final String STATE_KEY_SUPER = "super";
     private static final String STATE_KEY_SEARCH_MODE = "search_mode";
@@ -92,10 +90,7 @@ public class SearchLayout extends FrameLayout implements CompoundButton.OnChecke
 
     private FloatLabelEditText mEditTextTag;
 
-    private View mImageView;
-    private TextView mTextSelectImage;
-    private TextView mTextImagePath;
-    private ImageView mImagePreview;
+    private SelectSearchImageLayout mImageView;
 
     private View mActionView;
     private TextView mAction1;
@@ -218,24 +213,18 @@ public class SearchLayout extends FrameLayout implements CompoundButton.OnChecke
             // TODO add quick search
         } else if (v == mAction2) {
             taggleSearchMode();
-        } else if (v == mTextSelectImage) {
-            if (mHelper != null) {
-                mHelper.requestSelectImage();
-            }
         }
     }
 
     public void onSelectImage(@NotNull String imagePath) {
-        mTextImagePath.setText(imagePath);
+        mImageView.onSelectImage(imagePath);
+    }
 
-        if (mSearchImage != null && !mSearchImage.isRecycled()) {
-            mSearchImage.isRecycled();
+    @Override
+    public void onRequstSelectImage() {
+        if (mHelper != null) {
+            mHelper.onRequestSelectImage();
         }
-        mSearchImage = BitmapFactory.decodeFile(imagePath);
-        mImagePreview.setImageBitmap(mSearchImage);
-
-        ViewUtils.setVisibility(mTextImagePath, View.VISIBLE);
-        ViewUtils.setVisibility(mImagePreview, View.VISIBLE);
     }
 
     private class SearchHolder extends RecyclerView.ViewHolder {
@@ -393,19 +382,14 @@ public class SearchLayout extends FrameLayout implements CompoundButton.OnChecke
 
             if (mImageView == null) {
                 mInflater.inflate(R.layout.search_image, holder.content);
-                mImageView = holder.content.getChildAt(0);
-
-                mTextSelectImage = (TextView) mImageView.findViewById(R.id.search_select_image_action);
-                mTextImagePath = (TextView) mImageView.findViewById(R.id.search_select_image_path);
-                mImagePreview = (ImageView) mImageView.findViewById(R.id.search_select_image_image);
+                mImageView = (SelectSearchImageLayout) holder.content.getChildAt(0);
 
                 // Restore state
                 if (mSavedInstanceState != null) {
                     holder.content.restoreHierarchyState(mSavedInstanceState);
                 }
 
-                RippleSalon.addRipple(mTextSelectImage, false);
-                mTextSelectImage.setOnClickListener(SearchLayout.this);
+                mImageView.setHelper(SearchLayout.this);
             } else {
                 ViewUtils.removeFromParent(mImageView);
                 holder.content.addView(mImageView);
@@ -433,6 +417,6 @@ public class SearchLayout extends FrameLayout implements CompoundButton.OnChecke
     }
 
     public interface SearhLayoutHelper {
-        public void requestSelectImage();
+        public void onRequestSelectImage();
     }
 }

app/src/main/java/com/hippo/ehviewer/widget/SelectSearchImageLayout.java

@@ -0,0 +1,177 @@
+/*
+ * Copyright (C) 2015 Hippo Seven
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+package com.hippo.ehviewer.widget;
+
+import android.annotation.TargetApi;
+import android.content.Context;
+import android.graphics.Bitmap;
+import android.graphics.BitmapFactory;
+import android.os.Build;
+import android.os.Bundle;
+import android.os.Parcelable;
+import android.util.AttributeSet;
+import android.view.LayoutInflater;
+import android.view.View;
+import android.widget.ImageView;
+import android.widget.LinearLayout;
+import android.widget.TextView;
+
+import com.hippo.effect.ripple.RippleSalon;
+import com.hippo.ehviewer.R;
+import com.hippo.util.ViewUtils;
+import com.larvalabs.svgandroid.SVG;
+import com.larvalabs.svgandroid.SVGBuilder;
+
+import org.jetbrains.annotations.NotNull;
+
+public class SelectSearchImageLayout extends LinearLayout implements View.OnClickListener{
+
+    private static final String STATE_KEY_SUPER = "super";
+    private static final String STATE_KEY_PATH = "path";
+
+    private TextView mButtonSelect;
+    private TextView mTextPath;
+    private ImageView mImagePreview;
+
+    private String mSelectedPath;
+    private Bitmap mSelectedImage;
+
+    private SelectSearchImageLayoutHelper mHelper;
+
+    public SelectSearchImageLayout(Context context) {
+        super(context);
+        init(context);
+    }
+
+    public SelectSearchImageLayout(Context context, AttributeSet attrs) {
+        super(context, attrs);
+        init(context);
+    }
+
+    @TargetApi(Build.VERSION_CODES.HONEYCOMB)
+    public SelectSearchImageLayout(Context context, AttributeSet attrs, int defStyleAttr) {
+        super(context, attrs, defStyleAttr);
+        init(context);
+    }
+
+    @TargetApi(Build.VERSION_CODES.LOLLIPOP)
+    public SelectSearchImageLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
+        super(context, attrs, defStyleAttr, defStyleRes);
+        init(context);
+    }
+
+    private void init(Context context) {
+        LayoutInflater.from(context).inflate(R.layout.widget_select_search_image_layout, this);
+
+        // TODO It is a bad idea.
+        int childCount = getChildCount();
+        if (childCount == 3) {
+            setOrientation(LinearLayout.VERTICAL);
+        } else if (childCount == 2) {
+            setOrientation(LinearLayout.HORIZONTAL);
+        } else {
+            throw new IllegalStateException("Can't guess orientation, did you changed the layout res ?");
+        }
+
+        mButtonSelect = (TextView) findViewById(R.id.search_select_image_action);
+        mTextPath = (TextView) findViewById(R.id.search_select_image_path);
+        mImagePreview = (ImageView) findViewById(R.id.search_select_image_image);
+
+        RippleSalon.addRipple(mButtonSelect, false);
+        mButtonSelect.setOnClickListener(this);
+
+        ViewUtils.removeHardwareAccelerationSupport(mImagePreview);
+        SVG svg = new SVGBuilder().readFromResource(getResources(), R.raw.file_image).build();
+        mImagePreview.setImageDrawable(svg.getDrawable());
+    }
+
+    public void setHelper(SelectSearchImageLayoutHelper helper) {
+        mHelper = helper;
+    }
+
+    private void setImagePreview(String imagePath) {
+        if (mSelectedImage != null && !mSelectedImage.isRecycled()) {
+            mSelectedImage.isRecycled();
+        }
+        mSelectedImage = BitmapFactory.decodeFile(imagePath);
+        if (mSelectedImage != null) {
+            mImagePreview.setImageBitmap(mSelectedImage);
+        } else {
+            SVG svg = new SVGBuilder().readFromResource(getResources(), R.raw.file_image_off).build();
+            mImagePreview.setImageDrawable(svg.getDrawable());
+        }
+    }
+
+    public void onSelectImage(@NotNull String selectPath) {
+        mSelectedPath = selectPath;
+
+        mTextPath.setText(selectPath);
+        setImagePreview(selectPath);
+
+        ViewUtils.setVisibility(mTextPath, View.VISIBLE);
+        ViewUtils.setVisibility(mImagePreview, View.VISIBLE);
+
+        super.onDetachedFromWindow();
+        super.onAttachedToWindow();
+    }
+
+    @Override
+    protected void onAttachedToWindow() {
+        if (mSelectedPath != null) {
+            setImagePreview(mSelectedPath);
+        }
+    }
+
+    @Override
+    protected void onDetachedFromWindow() {
+        if (mSelectedImage != null && !mSelectedImage.isRecycled()) {
+            mSelectedImage.isRecycled();
+        }
+        mSelectedImage = null;
+    }
+
+    @Override
+    public Parcelable onSaveInstanceState() {
+        final Bundle state = new Bundle();
+        state.putParcelable(STATE_KEY_SUPER, super.onSaveInstanceState());
+        state.putString(STATE_KEY_PATH, mSelectedPath);
+        return state;
+    }
+
+    @Override
+    public void onRestoreInstanceState(Parcelable state) {
+        if (state instanceof Bundle) {
+            final Bundle savedState = (Bundle) state;
+            super.onRestoreInstanceState(savedState.getParcelable(STATE_KEY_SUPER));
+            String path = savedState.getString(STATE_KEY_PATH);
+            if (path != null) {
+                onSelectImage(path);
+            }
+        }
+    }
+
+    @Override
+    public void onClick(View v) {
+        if (mHelper != null) {
+            mHelper.onRequstSelectImage();
+        }
+    }
+
+    public interface SelectSearchImageLayoutHelper {
+        public void onRequstSelectImage();
+    }
+
+}

app/src/main/java/com/hippo/scene/Scene.java

@@ -62,6 +62,10 @@ public abstract class Scene {
         return mRootView;
     }
 
+    public StageActivity getStageActivity() {
+        return mStageActivity;
+    }
+
     public void startScene(Class sceneClass) {
         mStageActivity.startScene(this, sceneClass);
     }

app/src/main/java/com/hippo/util/ViewUtils.java

@@ -156,6 +156,15 @@ public final class ViewUtils {
         }
     }
 
+    @TargetApi(Build.VERSION_CODES.HONEYCOMB)
+    public static void addHardwareAccelerationSupport(View v) {
+        if (Build.VERSION.SDK_INT > Build.VERSION_CODES.HONEYCOMB) {
+            if (v.getLayerType() != View.LAYER_TYPE_HARDWARE) {
+                v.setLayerType(View.LAYER_TYPE_HARDWARE, null);
+            }
+        }
+    }
+
     public static void measureView(View v, int width, int height) {
         int widthMeasureSpec;
         int heightMeasureSpec;

app/src/main/res/layout-land/widget_select_search_image_layout.xml

@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!--
+  ~ Copyright (C) 2015 Hippo Seven
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~      http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+<merge
+    xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <LinearLayout
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_weight="1"
+        android:layout_gravity="center_vertical"
+        android:paddingRight="@dimen/search_item_interval_half"
+        android:orientation="vertical">
+
+        <TextView
+            android:id="@+id/search_select_image_action"
+            style="@style/CardButton"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_horizontal"
+            android:layout_marginBottom="@dimen/search_item_interval"
+            android:text="@string/search_select_image"/>
+
+        <TextView
+            android:id="@+id/search_select_image_path"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:visibility="gone"/>
+
+    </LinearLayout>
+
+    <FrameLayout
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_weight="1"
+        android:paddingLeft="@dimen/search_item_interval_half">
+
+        <com.hippo.widget.FixedAspectImageView
+            android:id="@+id/search_select_image_image"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center"
+            android:minHeight="@dimen/select_image_preview_min_height"
+            android:maxHeight="@dimen/select_image_preview_max_height"
+            android:adjustViewBounds="true"
+            android:contentDescription="@null"/>
+
+    </FrameLayout>
+
+</merge>

app/src/main/res/layout-sw600dp/search_category.xml

@@ -24,6 +24,7 @@
     <LinearLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
+        android:minHeight="@dimen/search_category_min_height"
         android:orientation="vertical"
         android:paddingLeft="@dimen/search_category_padding_start"
         android:paddingRight="@dimen/search_category_padding_end"
@@ -39,9 +40,17 @@
             android:textAppearance="@style/TextAppearance.CategoryTitle"/>
 
         <FrameLayout
-            android:id="@+id/category_content"
             android:layout_width="match_parent"
-            android:layout_height="wrap_content"/>
+            android:layout_height="0dp"
+            android:layout_weight="1">
+
+            <FrameLayout
+                android:id="@+id/category_content"
+                android:layout_width="match_parent"
+                android:layout_height="wrap_content"
+                android:layout_gravity="center_vertical"/>
+
+        </FrameLayout>
 
     </LinearLayout>
 

app/src/main/res/layout-sw600dp/widget_select_search_image_layout.xml

@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!--
+  ~ Copyright (C) 2015 Hippo Seven
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~      http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+
+<merge
+    xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <LinearLayout
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_weight="1"
+        android:layout_gravity="center_vertical"
+        android:orientation="vertical">
+
+        <TextView
+            android:id="@+id/search_select_image_action"
+            style="@style/CardButton"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center_horizontal"
+            android:layout_marginBottom="@dimen/search_item_interval"
+            android:text="@string/search_select_image"/>
+
+        <TextView
+            android:id="@+id/search_select_image_path"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:visibility="gone"/>
+
+    </LinearLayout>
+
+    <com.hippo.widget.Space
+        android:layout_width="@dimen/search_item_interval"
+        android:layout_height="match_parent"/>
+
+    <FrameLayout
+        android:layout_width="0dp"
+        android:layout_height="wrap_content"
+        android:layout_weight="1">
+
+        <com.hippo.widget.FixedAspectImageView
+            android:id="@+id/search_select_image_image"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_gravity="center"
+            android:minHeight="@dimen/select_image_preview_min_height"
+            android:maxHeight="@dimen/select_image_preview_max_height"
+            android:adjustViewBounds="true"
+            android:contentDescription="@null"/>
+
+    </FrameLayout>
+
+</merge>

app/src/main/res/layout/search_image.xml

@@ -13,37 +13,8 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
   -->
-<LinearLayout
+<com.hippo.ehviewer.widget.SelectSearchImageLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/search_select_image"
     android:layout_width="match_parent"
-    android:layout_height="wrap_content"
-    android:orientation="vertical">
-
-    <TextView
-        android:id="@+id/search_select_image_action"
-        style="@style/CardButton"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_gravity="center_horizontal"
-        android:layout_marginBottom="@dimen/search_item_interval"
-        android:text="@string/search_select_image"/>
-
-    <TextView
-        android:id="@+id/search_select_image_path"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginBottom="@dimen/search_item_interval"
-        android:visibility="gone"/>
-
-    <com.hippo.widget.FixedAspectImageView
-        android:id="@+id/search_select_image_image"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_gravity="center_horizontal"
-        android:layout_marginBottom="@dimen/search_item_interval"
-        android:adjustViewBounds="true"
-        android:maxHeight="240dp"
-        android:visibility="gone"
-        android:contentDescription="@null"/>
-
-</LinearLayout>
+    android:layout_height="wrap_content"/>

app/src/main/res/layout/widget_select_search_image_layout.xml

@@ -0,0 +1,46 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  ~ Copyright (C) 2015 Hippo Seven
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~      http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+<merge
+    xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <TextView
+        android:id="@+id/search_select_image_action"
+        style="@style/CardButton"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_horizontal"
+        android:layout_marginBottom="@dimen/search_item_interval"
+        android:text="@string/search_select_image"/>
+
+    <TextView
+        android:id="@+id/search_select_image_path"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginBottom="@dimen/search_item_interval"
+        android:visibility="gone"/>
+
+    <com.hippo.widget.FixedAspectImageView
+        android:id="@+id/search_select_image_image"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="center_horizontal"
+        android:adjustViewBounds="true"
+        android:minHeight="@dimen/select_image_preview_min_height"
+        android:maxHeight="@dimen/select_image_preview_max_height"
+        android:visibility="gone"
+        android:contentDescription="@null"/>
+
+</merge>

app/src/main/res/raw/file_image.svg

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="0 0 24.00 24.00">
+	<path fill-opacity="0.54" fill="#000000" d="M13,9H18.5L13,3.5V9M6,2H14L20,8V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M6,20H15L18,20V12L14,16L12,14L6,20M8,9A2,2 0 0,0 6,11A2,2 0 0,0 8,13A2,2 0 0,0 10,11A2,2 0 0,0 8,9Z" />
+</svg>

app/src/main/res/raw/file_image_off.svg

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="24" height="24" viewBox="-47 88 24 24">
+<g>
+	<path fill-opacity="0.54" fill="#000000" d="M-28.9,100v4.9l2,2.5V96l-6-6h-8l9.8,12.2L-28.9,100z M-33.9,91.5l5.5,5.5h-5.5V91.5z"/>
+	<path fill-opacity="0.54" fill="#000000" d="M-43.7,89l-1.3,1l2,2.6V108c0,1.1,0.9,2,2,2h12l1.6,2l1.3-1L-43.7,89z M-39.3,97l2.2,2.8c-0.3,0.7-1,1.2-1.8,1.2c-1.1,0-2-0.9-2-2C-40.9,98-40.2,97.2-39.3,97z M-31.9,108h-9l5.8-5.8l4.6,5.8H-31.9z"/>
+</g>
+</svg>

app/src/main/res/values-sw600dp/dimens.xml

@@ -16,20 +16,24 @@
   -->
 <resources>
 
-    <!-- Search category title layout height -->
-    <dimen name="search_category_title_height">64dp</dimen>
+    <!-- Content -->
+    <dimen name="content_padding_start">52dp</dimen>
+    <dimen name="content_padding_end">52dp</dimen>
+    <dimen name="content_fab_margin_end">24dp</dimen>
 
-    <!-- Search category padding start / end / bottom -->
+    <!-- Search category -->
     <dimen name="search_category_padding_start">52dp</dimen>
     <dimen name="search_category_padding_end">52dp</dimen>
     <dimen name="search_category_padding_bottom">32dp</dimen>
-
-    <!-- Search item interval -->
-    <dimen name="search_item_interval">16dp</dimen>
-
-    <!-- Search category interval -->
     <dimen name="search_category_interval">16dp</dimen>
+    <dimen name="search_category_min_height">252dp</dimen>
+    <dimen name="search_category_title_height">64dp</dimen>
 
+    <!-- Search item -->
+    <dimen name="search_item_interval">16dp</dimen>
+    <dimen name="search_item_interval_half">8dp</dimen>
+    <dimen name="select_image_preview_min_height">240dp</dimen>
+    <dimen name="select_image_preview_max_height">480dp</dimen>
     <dimen name="search_action_button_width">160dp</dimen>
 
     <!-- Keyline -->
@@ -41,17 +45,8 @@
 
     <!-- CategoryTable -->
     <dimen name="category_table_item_height">48dp</dimen>
-    <dimen name="category_table_item_margin_half">8dp</dimen>
-
-    <!-- AdvanceSearchTable -->
-    <dimen name="advance_search_table_item_margin_half">8dp</dimen>
 
     <!-- CardButton -->
     <dimen name="card_button_padding">16dp</dimen>
 
-    <!-- Content -->
-    <dimen name="content_padding_start">52dp</dimen>
-    <dimen name="content_padding_end">52dp</dimen>
-    <dimen name="content_fab_margin_end">24dp</dimen>
-
 </resources>

app/src/main/res/values/colors.xml

@@ -13,6 +13,15 @@
   ~ See the License for the specific language governing permissions and
   ~ limitations under the License.
   -->
+<!--
+    The standard opacity for an active icon on a light background is 54% (#000000).
+    An inactive icon, which is lower in the visual hierarchy, should have an
+    opacity of 26% (#000000).
+
+    The standard opacity for an active icon on a dark background is 100% (#FFFFFF).
+    An inactive icon, which is lower in the visual hierarchy, should have an
+    opacity of 30% (#FFFFFF).
+ -->
 <resources>
 
     <!-- Red -->

app/src/main/res/values/dimens.xml

@@ -15,20 +15,24 @@
   -->
 <resources>
 
-    <!-- Search category padding start / end / bottom -->
+    <!-- Search Content -->
+    <dimen name="content_padding_start">0dp</dimen>
+    <dimen name="content_padding_end">0dp</dimen>
+    <dimen name="content_fab_margin_end">0dp</dimen>
+
+    <!-- Search category -->
     <dimen name="search_category_padding_start">16dp</dimen>
     <dimen name="search_category_padding_end">16dp</dimen>
     <dimen name="search_category_padding_bottom">8dp</dimen>
-
-    <!-- Search category title layout height -->
+    <dimen name="search_category_interval">8dp</dimen>
+    <dimen name="search_category_min_height">0dp</dimen>
     <dimen name="search_category_title_height">48dp</dimen>
 
-    <!-- Search item interval -->
+    <!-- Search item -->
     <dimen name="search_item_interval">8dp</dimen>
-
-    <!-- Search category interval -->
-    <dimen name="search_category_interval">8dp</dimen>
-
+    <dimen name="search_item_interval_half">4dp</dimen>
+    <dimen name="select_image_preview_min_height">120dp</dimen>
+    <dimen name="select_image_preview_max_height">240dp</dimen>
     <dimen name="search_action_button_width">0dp</dimen>
 
     <!-- Switch padding -->
@@ -45,18 +49,14 @@
 
     <!-- CategoryTable -->
     <dimen name="category_table_item_height">40dp</dimen>
-    <dimen name="category_table_item_margin_half">4dp</dimen>
+    <dimen name="category_table_item_margin_half">@dimen/search_item_interval_half</dimen>
 
     <!-- AdvanceSearchTable -->
-    <dimen name="advance_search_table_item_margin_half">4dp</dimen>
+    <dimen name="advance_search_table_item_margin_half">@dimen/search_item_interval_half</dimen>
 
     <!-- CardButton -->
     <dimen name="card_button_padding">8dp</dimen>
 
-    <!-- Content -->
-    <dimen name="content_padding_start">0dp</dimen>
-    <dimen name="content_padding_end">0dp</dimen>
-
     <!-- Default elevation -->
     <dimen name="default_elevation">4dp</dimen>