androidimageviewandroid-glideviewflipperandroid-viewflipper

ViewFlipper images aren't being viewed


On one of my Android app's activities, I have a ViewFlipper with 3 ImageViews inside it, built like this:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.example.app.MainActivity"
    tools:showIn="@layout/app_bar_main"
    android:layout_margin="8dp"
    android:background="#fff">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <ViewFlipper
            android:id="@+id/flipper"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:scaleType="center"
                android:id="@+id/imageFlipper1"
                android:adjustViewBounds="true" />

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:scaleType="center"
                android:id="@+id/imageFlipper2"
                android:adjustViewBounds="true" />

            <ImageView
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:scaleType="center"
                android:id="@+id/imageFlipper3"
                android:adjustViewBounds="true" />

        </ViewFlipper>

    </LinearLayout>

</ScrollView>

I load images from the web to the ImageViews using Glide library (com.github.bumptech.glide:glide:3.7.0') using this code:

flipper = (ViewFlipper) findViewById(R.id.flipper);
imageFlipper1 = (ImageView) findViewById(R.id.imageFlipper1);
imageFlipper2 = (ImageView) findViewById(R.id.imageFlipper2);
imageFlipper3 = (ImageView) findViewById(R.id.imageFlipper3);

// Load images
Glide.with(getApplicationContext()).load("url1").into(imageFlipper1);
Glide.with(getApplicationContext()).load("url2").into(imageFlipper2);
Glide.with(getApplicationContext()).load("url3").into(imageFlipper3);

// Setup the ViewFlipper
flipper.setAutoStart(true);
flipper.setFlipInterval(2000);
flipper.startFlipping();

The URLs are valid, so when I tried to load the image to an independent ImageView, I saw the image on the screen. Basically nothing should contain errors, but for some reason, when I run the app, I don't see any images on the screen.

Can you please help me with that?


Solution

  • I've finally found a solution. I changed the width and height of the ViewFlipper to match_parent and wrap_content, and the widths and heights of the inner RelativeLayouts to match_parent, and now I can see the images on my activity:

    <?xml version="1.0" encoding="utf-8"?>
    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:context="com.example.app.MainActivity"
        tools:showIn="@layout/app_bar_main"
        android:layout_margin="8dp"
        android:background="#fff">
    
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical">
    
            <ViewFlipper
                android:id="@+id/flipper"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">
    
                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center"
                    android:gravity="center">
    
                    <ImageView
                        android:id="@+id/flipper1"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:adjustViewBounds="true"
                        android:foregroundGravity="center"
                        android:scaleType="fitCenter"/>
    
                </RelativeLayout>
    
                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center"
                    android:gravity="center">
    
                    <ImageView
                        android:id="@+id/flipper2"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:adjustViewBounds="true"
                        android:foregroundGravity="center"
                        android:scaleType="fitCenter"/>
    
                </RelativeLayout>
    
                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center"
                    android:gravity="center">
    
                    <ImageView
                        android:id="@+id/flipper3"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:adjustViewBounds="true"
                        android:foregroundGravity="center"
                        android:scaleType="fitCenter"/>
    
                </RelativeLayout>
    
            </ViewFlipper>
    
        </LinearLayout>
    
    </ScrollView>