How to create Scroll Layout?

Question

I have a problem with ScrollView. This is my XMl file:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000">

<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true" >

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

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scaleType="centerCrop"
            android:layout_weight="0.2"
            android:id="@+id/imageView2"
            android:adjustViewBounds="false" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="0.8"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:text=""
            android:textColor="#ffff"
            android:id="@+id/body" />
        </LinearLayout>
</ScrollView>

And this is activity:

public class NewsBodyFragment extends Fragment{

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View v = inflater.inflate(R.layout.news_body_fragment, container, false);

    ImageView image = (ImageView) v.findViewById(R.id.imageView2);
    TextView textView = (TextView) v.findViewById(R.id.body);
    //textView.setMovementMethod(new ScrollingMovementMethod());
    String body = getArguments().getString("body");
    byte[] bmpArray = getArguments().getByteArray("image");
    if(bmpArray != null) {
        Bitmap bmp = BitmapFactory.decodeByteArray(bmpArray, 0, bmpArray.length);
        image.setImageBitmap(bmp);
    }
    else
    {
        image.setImageDrawable(getResources().getDrawable(R.drawable.empirelogo));
    }
    textView.setText(body);
    return v;
}

}

My problem is the ScrollView, When I use this code my ScrollView doesn't scroll. Image and TextView should look like this and they should scrolling together:

http://s18.postimg.org/5tu7dsmpl/3_E6_ABE7_F385_F5_EE469_EDD28_D9_C26055156_C987_E0_D5_D02_D7.jpg

But In my case they are don't scrolling. When I use ScrollView android:layout_height="wrap_content". It's look like this:

http://s30.postimg.org/e15g3scfl/23_C4_C2_C62_BBCF4_E22_E9_B2_A04_ED7923278_C418_DA6_CDF7_EF1.jpg

Please help me who know the answer or solution.

why did you use a scrollview anyway? you don't want a scroll view to achieve what in the image link? — hasan, Aug 16 '15 at 14:10

score 0 · Accepted Answer · edited May 23 '17 at 12:06

Approach: Get ScrollView height and set the height of the ImageView to scrollViewHeight * 0.8 on onCreate Method:

ScrollView scrollView = (ScrollView)findViewById(R.id.contentScrollView);
ImageView imageView = (ImageView)findViewById(R.id.contentImageView);

ViewTreeObserver vto = scrollView.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        scrollView.getViewTreeObserver().removeGlobalOnLayoutListener(this);
        int width  = scrollView.getMeasuredWidth();
        int height = scrollView.getMeasuredHeight();

        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(layoutParams.MATCH_PARENT, height * 0.8f);
        imageView.setLayoutParams(layoutParams);
    }
});

Check my answer here for the purpose of using OnGlobalLayoutListener as a place to fetch the ScrollView height.

Values for weight should be swapped. also set the TextView height as wrap_content and remove the weight:

<ScrollView
    android:id="@+id/contentScrollView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true" >

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

        <ImageView
            android:id="@+id/contentImageView"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:scaleType="centerCrop"
            android:adjustViewBounds="false" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:paddingLeft="@dimen/activity_horizontal_margin"
            android:paddingRight="@dimen/activity_horizontal_margin"
            android:paddingTop="@dimen/activity_vertical_margin"
            android:paddingBottom="@dimen/activity_vertical_margin"
            android:text=""
            android:textColor="#ffff"
            android:id="@+id/body" />

    </LinearLayout>

</ScrollView>

If I have TextView with long text. In this case I need ScrollView — Инкогнито, Aug 16 '15 at 14:16
Is it a mandatory that the image to take 0.8 of the screen height? can't be just a fixed height. which is more logical because users with big screens expect to see more data in there screens and not to enlarge them. thats the mobile development guide line. upon your answer I will edit my answer :) — hasan, Aug 16 '15 at 14:19
About image, yes. But 0.8 image should scroll with the TextView, — Инкогнито, Aug 16 '15 at 14:23
If that didn't work the only solution is to do it in the activity code behind. please, let me know if that didn't work. — hasan, Aug 16 '15 at 14:26

How to create Scroll Layout?

1 Answers1