Make a child view match the width of a parent scrollview

问题

I have a horizontal scrollview with many EditText children. I want each of these children to be the same width of the visible area of the parent scrollview. Is this possible in XML?

回答1:

You can do it writing a small helper class:

We are creating a very small class that extends EditText called FullWidthEditText like this:

package com.YOURPACKAGENAME;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.EditText;
import android.widget.HorizontalScrollView;

public class FullWidthEditText extends EditText {
    public FullWidthEditText(Context context) { super(context);}    
    public FullWidthEditText(Context context, AttributeSet attrs) { super(context, attrs); }
    public FullWidthEditText(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

        View parentScrollView=((View)(getParent().getParent()));

        if (parentScrollView!=null) {
            // check the container of the container is an HorizontallScrollView
            if (parentScrollView instanceof HorizontalScrollView) {
                // Yes it is, so change width to HSV's width
                widthMeasureSpec=parentScrollView.getMeasuredWidth();
            }
        }
        setMeasuredDimension(widthMeasureSpec, heightMeasureSpec);
    }
}

Now you have this class created, you can use it in your XML just like a normal EditText:

<?xml version="1.0" encoding="utf-8"?>
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/horizontalScrollView1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="#ffff0000" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="30dp"
        android:layout_marginRight="5dp"
        android:orientation="horizontal" >

        <com.YOURPACKAGENAME.FullWidthEditText
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:id="@+id/yourEditTextId">
        </com.YOURPACKAGENAME.FullWidthEditText>

        <com.YOURPACKAGENAME.FullWidthEditText
            android:layout_width="wrap_content"
            android:layout_height="match_parent" >
        </com.YOURPACKAGENAME.FullWidthEditText>
        .
        .
        .
    </LinearLayout>
</HorizontalScrollView>

You can also create it programmatically, add handlers, listeners, change text, findViewById ... etc ... just like a normal EditText.

 EditText editText=new EditText(context);
 FullWidthEditText fullWidthEditText=new FullWidthEditText(context);

Note that this solution works for any other Widget as well. If you need ie. a full-width button, just change extends EditText for extends Button and you got it.
You can easily customize the size, the key line is: widthMeasureSpec=parentScrollView.getMeasuredWidth(); so you can ie. make full width minus 10 or 20px, make half width, etc.

Hope it helps !

回答2:

I think ViewPager should be more appropriate but maybe you can try this view hierarchy:

HorizontalScrollView (width = MATCH_PARENT, weightSum = 1)
- LinearLayout (orientation = HORIZONTAL, weight = 3, weightSum = 3)
  - LinearLayout (page 1, orientation = VERTICAL, weight = 1)
    - EditText (width = MATCH_PARENT)
  - LinearLayout (page 2, orientation = VERTICAL, weight = 1)
    - EditText (width = MATCH_PARENT)
  - LinearLayout (page 3, orientation = VERTICAL, weight = 1)
    - EditText (width = MATCH_PARENT)

Note: I have not tested it.

回答3:

For your EditTexts, when you set layout_width or height to match_parent, they'll match whatever size their parent is set to. But their dimensions will expand once their content will be filled with text, hence having the same width / height than the ScrollView.

回答4:

Although it can be done using horizontal scrollview. I have found it is much much easier to use a view pager instead. Its also cleaner and allows for a smoother swipe in my opinion.

Add the xml

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

set the pager up

 mPager =(ViewPager)getActivity().findViewById(R.id.pager);
        mPager .setAdapter(new CustomPagerAdapter());
        mPager .setOffscreenPageLimit(6);

Adapter

public class CustomPagerAdapter extends PagerAdapter {
    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        LayoutInflater inflater = (LayoutInflater) container.getContext()
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View page= inflater.inflate(R.layout.page_item, container, false);

        TextView textView =(TextView)page.findViewById(R.id.textView);


        textView.setText("Text");

        container.addView(page);
        return(page);
    }

    @Override
    public void destroyItem(ViewGroup container, int position,
                            Object object) {
        container.removeView((View)object);
    }

    @Override
    public int getCount() {
        return 16;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view.equals( object );
    }


}

回答5:

I found some edge cases where the FullWidthEditText posted by rupps didn't work, so I modified it to work in all the cases I've found:

public class FullWidthTextView extends android.support.v7.widget.AppCompatTextView
{
    public FullWidthTextView( final Context context )
    {
        super( context );
    }

    public FullWidthTextView( final Context context, @Nullable final AttributeSet attrs )
    {
        super( context, attrs );
    }

    public FullWidthTextView( final Context context, @Nullable final AttributeSet attrs, final int defStyleAttr )
    {
        super( context, attrs, defStyleAttr );
    }

    @Override
    protected void onMeasure( int widthMeasureSpec, int heightMeasureSpec )
    {
        View parentScrollView = ((View) (getParent().getParent()));

        boolean needsRemeassure = false;

        if( parentScrollView != null )
        {
            // check the container of the container is an HorizontallScrollView
            if( parentScrollView instanceof HorizontalScrollView )
            {
                // Yes it is, so change width to HSV's width
                int parentWidth = parentScrollView.getMeasuredWidth();
                if( parentWidth > 0 )
                {
                    widthMeasureSpec = parentWidth;
                }
                // It's possible for the parent to still have ZERO width
                // in this case we must request to be remeassured
                else
                {
                    needsRemeassure = true;
                }
            }
        }

        super.onMeasure( widthMeasureSpec, heightMeasureSpec );

        setMeasuredDimension( View.MeasureSpec.makeMeasureSpec( widthMeasureSpec, MeasureSpec.EXACTLY ),
                              View.MeasureSpec.makeMeasureSpec( getMeasuredHeight(), MeasureSpec.EXACTLY ) );

        if( needsRemeassure )
        {
            post( new Runnable()
            {
                @Override
                public void run()
                {
                    requestLayout();
                }
            } );
        }
    }
}

来源：https://stackoverflow.com/questions/22442386/make-a-child-view-match-the-width-of-a-parent-scrollview

标签

android

layout

scrollview