0

I have a Constraint Layout and within that I have an ImageView. I put a Linear Layout in my XML underneath that for some ImageButtons I want my app to scroll through. I researched and found that I need to wrap my Linear Layout in a ScrollView which I did but for some reason it will not show the bottom of my content. It cuts off the bottom of the view in the emulator. I tried wrapping the ScrollView in a Relative Layout which was suggested in one of the forums but that did nothing. I also tried setting the ScrollView with android:fillViewport="true" but that did not work either. I will attach screen shot of what it looks like and I will paste XML below that.

screenshot of app with content not showing at bottom

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout
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"
tools:context="com.autismacademyed.www.autismacademy.AutismAcademy">


<ImageView
    android:id="@+id/imageView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintHorizontal_bias="0.0"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:srcCompat="@drawable/logo" />


<ScrollView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="8dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginTop="8dp"
    app:layout_constraintTop_toBottomOf="@+id/imageView2">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="0dp"
        android:layout_marginLeft="2dp"
        android:layout_marginRight="2dp"
        android:layout_marginTop="0dp"
        android:orientation="vertical"
        android:scrollIndicators="right|end"
        android:scrollbars="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/imageView2"
        app:layout_constraintVertical_bias="0.0">

        <ImageButton
            android:id="@+id/imageButtonRed"
            android:layout_width="104dp"
            android:layout_height="124dp"
            android:layout_marginLeft="8dp"
            android:layout_marginStart="8dp"
            android:background="@null"
            android:onClick="imageButtonOnClick"
            android:scaleType="centerCrop"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/imageButtonYellow"
            app:srcCompat="@drawable/ic_action_red" />

        <ImageButton
            android:id="@+id/imageButtonBlue"
            android:layout_width="125dp"
            android:layout_height="110dp"
            android:layout_marginTop="8dp"
            android:background="@null"
            android:scaleType="centerCrop"
            app:layout_constraintTop_toBottomOf="@+id/imageButtonRed"
            app:srcCompat="@drawable/ic_action_blue"
            tools:layout_editor_absoluteX="0dp" />

        <ImageButton
            android:id="@+id/imageButtonYellow"
            android:layout_width="109dp"
            android:layout_height="125dp"
            android:layout_marginLeft="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:background="@null"
            android:onClick="imageButtonOnClick"
            android:scaleType="centerCrop"
            android:visibility="visible"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/imageView2"
            app:srcCompat="@mipmap/ic_yellowpuzzlepiece" />

        <ImageButton
            android:id="@+id/imageButtonGreen"
            android:layout_width="109dp"
            android:layout_height="125dp"
            android:background="@null"
            android:scaleType="centerCrop"
            app:layout_constraintTop_toBottomOf="@+id/imageButtonYellow"
            app:srcCompat="@drawable/ic_action_green" />


        <ImageButton
            android:id="@+id/imageButtonBrown"
            android:layout_width="109dp"
            android:layout_height="125dp"
            android:background="@null"
            android:scaleType="centerCrop"
            app:layout_constraintTop_toBottomOf="@+id/imageButtonYellow"
            app:srcCompat="@drawable/ic_action_green" />

    </LinearLayout>

</ScrollView>

</android.support.constraint.ConstraintLayout>
  • @Selvin I am still new to programming so what you said doesn't make much sense to me. If you could be more specific please do. – ZachGiovanelli Jul 08 '17 at 22:21

1 Answers1

0

So after doing a considerable amount of research on this forums site and through video tutorials I decided to post this question. I apologize to waste other people's time but I noticed on the left related questions! I found an article that was similar enough to my layout that when reading it I understood how to solve my own problem! I messed around with the code and removed the Linear Layout from my XML and replaced it with another Constraint Layout. I also added the fillViewPort line of code to ScrollView and removed the Layout Width and Height and changed it to 0dp. I use the constraints option to have the ScrollView fit properly in the Emulator and I did the same things for the ImageButtons to align on top of each other properly. I will link the article that helped me!

Bottom of ScrollView clipped when using ConstraintLayout