Our app (WordPress for Android) uses a scrollview for the new post view, where a user enters in their new blog post. There's quite a few fields on this view, including a large EditText for the post content field.
It appears that when an EditText is in a ScrollView, the ScrollView takes over the scrolling action, so the user can't scroll within the EditText area if they are writing a large post. What can be done so that scrolling will work both within the EditText and the ScrollView?
Here is the layout xml for this view, any help would be appreciated! The EditText that needs the scrolling is @id/content:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/main"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:scrollbars="none"
android:background="#FFF5F5F5">
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:padding="10dip"
>
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/content_bg"
android:id="@+id/section1">
<TextView android:id="@+id/l_section1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Post Content"
style="@style/WordPressSectionHeader"/>
<TextView android:id="@+id/l_title"
android:layout_below="@id/l_section1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/post_title"/>
<EditText android:id="@+id/title"
android:minHeight="40dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:drawable/editbox_background"
android:autoText="true"
android:capitalize="sentences"
android:layout_below="@id/l_title"/>
<TextView android:id="@+id/l_content"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/post_content"
android:layout_below="@id/title"/>
<EditText android:id="@+id/content"
android:gravity="top"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:drawable/editbox_background"
android:minLines="5"
android:maxLines="5"
android:autoText="true"
android:capitalize="sentences"
android:layout_below="@id/l_content"/>
<Button
android:id="@+id/bold"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/content"
android:textStyle="bold"
android:textSize="22dip"
android:text="B" />
<Button
android:id="@+id/em"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/bold"
android:layout_toRightOf="@id/bold"
android:textStyle="italic"
android:textSize="22dip"
android:text="I " />
<Button
android:id="@+id/link"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/em"
android:layout_toRightOf="@id/em"
android:textSize="22dip"
android:textColor="#006699"
android:text="link" />
<Button
android:id="@+id/bquote"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="@id/link"
android:layout_toRightOf="@id/link"
android:textSize="22dip"
android:text="b-quote" />
</RelativeLayout>
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/content_bg"
android:id="@+id/section2"
android:layout_marginTop="10dip"
android:layout_below="@id/section1">
<TextView android:id="@+id/l_media"
android:layout_marginBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Media"
style="@style/WordPressSectionHeader"/>
<Button
android:id="@+id/addPictureButton"
android:layout_marginTop="4dip"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/l_media"
android:textSize="18dip"
android:text="@string/add"/>
<Button
android:id="@+id/clearPicture"
android:background="@drawable/wp_button_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
android:textSize="18dip"
android:layout_alignBottom="@id/addPictureButton"
android:layout_toRightOf="@id/addPictureButton"
android:text="@string/clear" />
<GridView
android:id="@+id/gridView"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:gravity="fill_vertical"
android:numColumns="3"
android:visibility="gone"
android:layout_below="@id/addPictureButton">
</GridView>
</RelativeLayout>
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/content_bg"
android:id="@+id/section3"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:layout_below="@id/section2">
<TextView android:id="@+id/l_tags_categories"
android:layout_marginBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Tags & Categories"
style="@style/WordPressSectionHeader"/>
<TextView android:id="@+id/l_tags"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/l_tags_categories"
android:text="@string/tags_separate_with_commas"/>
<EditText android:id="@+id/tags"
android:minHeight="40dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@android:drawable/editbox_background"
android:autoText="true"
android:layout_below="@id/l_tags"/>
<TextView android:id="@+id/l_category"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/categories"
android:layout_below="@id/tags"
android:layout_marginTop="10dip"/>
<Button
android:id="@+id/selectCategories"
android:background="@drawable/wp_button_small"
android:layout_below="@id/l_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dip"
android:text="@string/select_categories" />
<TextView android:id="@+id/selectedCategories"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/selected_categories"
android:layout_below="@id/selectCategories"/>
</RelativeLayout>
<RelativeLayout android:id="@+id/location_wrapper"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="@id/section3"
android:layout_marginTop="-10dip">
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/content_bg"
android:id="@+id/section4"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:layout_below="@id/section3"
android:visibility="gone">
<TextView android:id="@+id/l_location"
android:layout_marginBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/location"
style="@style/WordPressSectionHeader"/>
<TextView android:id="@+id/locationText"
android:layout_marginBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/loading"
android:layout_below="@id/l_location"/>
<Button
android:id="@+id/viewMap"
android:background="@drawable/wp_button_small"
android:layout_below="@id/locationText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="18dip"
android:text="View Map" />
</RelativeLayout>
</RelativeLayout>
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@drawable/content_bg"
android:id="@+id/section5"
android:layout_marginTop="10dip"
android:layout_marginBottom="10dip"
android:layout_below="@id/location_wrapper">
<TextView android:id="@+id/l_status"
android:layout_marginBottom="6dip"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="@string/status"
style="@style/WordPressSectionHeader"/>
<CheckBox android:id="@+id/publish"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/l_status"
android:text="@string/publish"
android:button="@drawable/wp_checkbox"
/>
</RelativeLayout>
<Button
android:id="@+id/post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/section5"
android:layout_alignParentRight="true"
android:textSize="18dip"
android:background="@drawable/wp_button"
android:text="@string/save" />
<Button
android:id="@+id/upload"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="@id/post"
android:layout_toLeftOf="@id/post"
android:textSize="18dip"
android:background="@drawable/wp_button"
android:text="@string/upload_now" />
</RelativeLayout>
</ScrollView>
From what i've read on a forums so far , having several scrollable containers on same screen is not a good idea. Now, those post were usually about listview , gridview in combination with scrollview but still to me it seems that the best solution redesign the screen to avoid that.
If you need the edittext on the same screen add this to your oncreate method after you initialize your edittext. It works for me.
edittext.setOnTouchListener(new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
Log.v("TAG", "CHILD TOUCH");
// Disallow the touch request for parent scroll on touch of
// child view
if(event.getAction() == MotionEvent.ACTION_UP)
scrollview.requestDisallowInterceptTouchEvent(false);
else
scrollview.requestDisallowInterceptTouchEvent(true);
return false;
}
});
What its doing is saying if someone touches the the edittext then disable the scrollview. Then once they lift their finger up from the edittext (once they are done with it) re-enable the scrollview.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With