android - 水平图像 ListView 可以在 android 中重叠

Question

这是我预期的布局:

如您所见，此 slider 一次仅显示一张完整图像，其他图像重叠。所有图像都是从代码动态添加的。我尝试使用 LinearLayout 作为所有图像的容器，但所有图像都溢出了屏幕。

 <LinearLayout
    android:id="@+id/llHorizontalImages"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:padding="10dp" >

 </LinearLayout>

还有代码:

 for (ImageInfo image : imagesList) {
    ImageView imageView = new ImageView(context);
    // load image from internet
    ImageLoader.getInstance().displayImage(image.getImagePath(), imageView);
    llHorizontalImages.addView(imageView, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
 }

我不知道如何使图像与其他图像重叠，以及当列表中有很多图像时如何保持图像不溢出父 View ，它们应该在更多照片 View 中计为数量。
有人有什么建议吗？

Answer 1

这个 snippnet 是一个线索来实现你想要的。你的问题让我很感兴趣，我试图得到相同的结果，但它是一种方法，还不完整。

Activity 类

int wScreen;        // WIDTH 1 (Screen width)

RelativeLayout mLayout, mTextLayout;        // CONTAINER (Parent's ImageViews)

ImageView imageView;           // VAR IMAGEVIEW

private Integer[] imageArray = {            // ARRAY IMAGES ITEMS
        R.drawable.img1, R.drawable.img2,   // (My test was with 18 items)
        R.drawable.img3, R.drawable.img4,
        R.drawable.img5, R.drawable.img6,
        ... };

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    // Init container
    mLayout = (RelativeLayout) findViewById(R.id.mContainer);
    // Init subcontainer
    mTextLayout = (RelativeLayout) findViewById(R.id.mTextCont);

    // Get width screen (int)
    DisplayMetrics display = this.getResources().getDisplayMetrics();
    wScreen = display.widthPixels;

    // Call the method
    horizontalListImage();  
}

Horizo​​ntalListImage 方法

private void horizontalListImage() {
    int wImage,         // WIDTH 2 (Images width)
        mChild,         // CHILD   (Count Images)
        n1,             // LOOP 1  (Creation Images)
        n2;             // LOOP 2  (BringToFont function)

    // Image width/height
    wImage = wScreen / 5;

    // Init images
    for(n1 = 0; n1 < imageArray.length; n1++) { 
        // Create new images
        imageView = new ImageView(this);
        imageView.setImageResource(imageArray[n1]);

        // Create a new params
        RelativeLayout.LayoutParams paramsImage = 
                new RelativeLayout.LayoutParams(wImage,wImage);
        // Start positioning Images from Left [1]
        paramsImage.addRule(RelativeLayout.ALIGN_PARENT_LEFT);

        // Except first Image
        if(n1 != 0) {
            // Set margins left to Images [2]
            paramsImage.setMargins((wImage/2)*n1,0,0,0);
        }

        // Add Images into Container
        mLayout.addView(imageView,paramsImage);

        /**
         *  [1] Images position from Left to Right: 0, 1, 2, 3, 4, 5..
         *  [2] Set margin left to positioning Image overlap each other
        **/

        // Screen have too much images
        if( ((wImage/2)*(n1+4)) >= wScreen && n1+1 < imageArray.length ) {
            break;
        }    
    }

    // Count children (Images) into container (RelativeLayout)
    mChild = mLayout.getChildCount();

    // Bring to front function [3]
    for(n2 = mChild - 1; n2 >= 0; n2--) {
        mLayout.getChildAt(n2).bringToFront();
        mLayout.getChildAt(n2).invalidate();
        /**
         *  [3] Bring to front method retrieve any Images in   
         *  descendant order and replace them one by one to the front
         *  Images position from Left to Right: ..5, 6, 4, 3, 2..
         *  
         *  Result: The first Image (now end position) comes to front
         *  and End Image (now start position) comes to background
         *  
        **/
    }

    // Number items total - number items displayed
    int mNbInfo = imageArray.length - (mChild-1);

    if(mNbInfo != 0) {
        // Change width/height for text
        RelativeLayout.LayoutParams paramsButton = 
                (RelativeLayout.LayoutParams) mTextLayout.getLayoutParams();
        paramsButton.height = paramsButton.width = wImage;
        mTextLayout.setLayoutParams(paramsButton);
        // Display text
        mTextLayout.setVisibility(View.VISIBLE);
        // Update text
        ((TextView) findViewById(R.id.btInfoText))
                                           .setText(mNbInfo+" More Photos");
    }

}

图像具有 half width image 的负左边距，并且它们的宽度设置为 screen divide by 5。我添加了一些评论来解释我做了什么..

布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/mContainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_vertical" >

    <RelativeLayout
        android:id="@+id/mTextCont"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:background="@drawable/button_background"
        android:visibility="gone" >

        <TextView
            android:id="@+id/btInfoText"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_centerInParent="true"
            android:textColor="#ffc4c4c4"
            android:textSize="12sp"
            android:padding="5dip"
            android:gravity="center" />

    </RelativeLayout>

</RelativeLayout>

可绘制

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners
        android:radius="5dip"
        android:topLeftRadius="0dip"
        android:bottomLeftRadius="@dimen/corner_bottom_left"
        android:bottomRightRadius="@dimen/corner_bottom_right" />
    <stroke
        android:width="1dip"
        android:color="#ffc4c4c4" />
    <solid
        android:color="#ffffffff" />
</shape>    

注意:android:bottomRightRadius 和 android:bottomLeftRadius 在 API 低于 12 (SDK 3.1) 时有一个错误。您应该在 dimens.xml 中设置半径并创建一个新文件夹 values-v12。请参阅此解决方案:Something's wrong in Corner radius .

所有都在main Thread 中，没有任何单独的Thread 或AsyncTask，您应该创建一些并行线程以避免性能不佳。我在 NexusOne (SDK 2.2) 和 GalaxyNexus (3.2) 上对此进行了测试。这给了我:

我希望这会有用。
问候。