0

SDCard から複数の画像を選択して、 WhatsApp Sending Multiple imagesのようにViewPager & Gridlayoutにロードできる画面を作成しようとしています(以下のスクリーン ショットのように)。

参考までにWhatsアプリのスクリーンショット

ViewPager と GridLayout (下の画像選択ビュー用) を使用して、スクリーン ショットのように実現できます。ユーザーがViewPagerをスワイプすると、GridLayoutのセレクターを変更する必要があります。この Selectoion Change パーツも、Relative Layout を GridLayout の Child として使用し、RelativeLayout の Background を更新することで実装されます。以下はこれらのxmlです

gridlayout_item.xml

 <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/layoutContainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/on_select"
android:padding="2dp" >

<ImageView
    android:id="@+id/imageone"
    android:layout_width="65dip"
    android:layout_height="65dip"
    android:layout_gravity="center_vertical"
    android:background="@drawable/on_select"
    android:padding="1dip"
    android:scaleType="center" />

</RelativeLayout>

activity_multi_selection.xml

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/imagepreviewouterlayout" >

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </android.support.v4.view.ViewPager>
</RelativeLayout>

<RelativeLayout
    android:id="@+id/imagepreviewouterlayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/bottom_layout"
    android:layout_marginBottom="10dip"
    android:layout_marginTop="10dip"
    android:background="@android:color/transparent"
    android:padding="5dp" >

    <GridLayout
        android:id="@+id/imagepreviewlayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:columnCount="5"
        android:horizontalSpacing="10dip"
        android:orientation="horizontal"
        android:rowCount="1"
        android:stretchMode="columnWidth"
        android:verticalSpacing="10dip" >

        <RelativeLayout
            android:id="@+id/layoutContainer"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/on_select"
            android:padding="2dp" >

            <ImageView
                android:id="@+id/imageone"
                android:layout_width="65dip"
                android:layout_height="65dip"
                android:layout_gravity="center_vertical"
                android:background="@drawable/on_select"
                android:padding="1dip"
                android:scaleType="center" />
        </RelativeLayout>

        <RelativeLayout
            android:id="@+id/add"
            android:layout_width="65dip"
            android:layout_height="65dip"
            android:background="@drawable/extrabtn_style"
            android:layout_gravity="center" >

            <Button
                android:id="@+id/button1"
                android:layout_width="20dp"
                android:layout_height="20dp"
                android:layout_centerHorizontal="true"
                android:layout_centerVertical="true"
                android:background="@drawable/addaccountimg" />

            <RelativeLayout
                android:id="@+id/addmoreimageBtn"
                android:layout_width="406dp"
                android:layout_height="match_parent"
                android:layout_alignParentBottom="true"
                android:layout_alignParentLeft="true"
                android:clickable="true" >
            </RelativeLayout>
        </RelativeLayout>

    </GridLayout>
</RelativeLayout>

<RelativeLayout
    android:id="@+id/bottom_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="@drawable/tabbar1" >

    <LinearLayout
        android:id="@+id/bottom_layout1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="1dp"
        android:weightSum="1" >

        <Button
            android:id="@+id/cancelBtn"
            android:layout_width="178dip"
            android:layout_height="50dp"
            android:layout_weight="0.5"
            android:background="@drawable/imageselector_btn"
            android:text="Cancel"
            android:textColor="#E9E9E9" />

        <Button
            android:id="@+id/sendImageBtn"
            android:layout_width="178dip"
            android:layout_height="50dp"
            android:layout_marginLeft="0.5dp"
            android:layout_weight="0.5"
            android:background="@drawable/imageselector_btn"
            android:text="Send"
            android:textColor="#E9E9E9" />
    </LinearLayout>
</RelativeLayout>

</RelativeLayout>

on_select.xml (選択ドローアブル)

<?xml version="1.0" encoding="utf-8"?>
 <selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:drawable="@drawable/box" android:state_selected="true"></item>
<item android:drawable="@drawable/box" android:state_checked="true"></item>
<item android:drawable="@drawable/box" android:state_focused="true"></item>
</selector>

しかし、ViewPager の PageChange(onPageSelected)で relativeLayout の Background を変更しているときに、パフォーマンスの問題に直面しています。ViewPager ページがしばらく打たれて動いているということです。

ViewPager の PageChange(onPageSelected) で gridlayout 項目の背景を更新するとコメントすると、スムーズに移動します。以下はコードスニペットです。

     @Override
            public void onPageSelected(final int arg0) {

                        if (griditemView!= null)
                            griditemView.setSelected(false);

                        griditemView = imagepreviewgridlayout.getChildAt(arg0);
                        if(griditemView!=null)
                        {
                            griditemView.setSelected(true);
                        }
            }

この問題を解決するのを手伝ってください。

4

0 に答える 0