views:

65

answers:

1

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 &amp; 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>
A: 

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.

Alex Volovoy
Thanks, maybe I'll have the EditText open up in a new view when clicked so that the user has more scroll control when editing the post content.
roundhill