user836200
user836200

Reputation: 655

Android scrollview overlaps with key layout element

I'm encountering a problem where my scrollbar is overlapping with an element from my layout. I'd like for the scroll bar to appear after the edit box: enter image description here. When adding the scroll bar to different parts of the xml file, I received error messages which I understand to mean that the scrollview had to be the root element. As a result, my code looks like this (when I feel like the scroll view should come after the first linear layout and/or edit box):

<?xml version="1.0" encoding="utf-8"?>
 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ScrollView01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/db1_root"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout style="@style/TitleBar">
        <ImageView style="@style/TitleBarLogo"
            android:contentDescription="@string/description_logo"
            android:src="@drawable/logo" />

        <ImageView style="@style/TitleBarSeparator" />
        <TextView style="@style/TitleBarText" />
        <ImageButton style="@style/TitleBarAction"
            android:contentDescription="@string/description_about"
            android:src="@drawable/about"
            android:onClick="onClickAbout" />
    </LinearLayout>

<LinearLayout
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
    <EditText 
        android:layout_width="match_parent" 
        android:id="@+id/status" 
        android:layout_height="wrap_content">
        <requestFocus></requestFocus>
    </EditText>
 <Button android:layout_width="wrap_content" android:text="Ok" android:textColor="@color/title_text" android:layout_gravity="center" android:background="@drawable/custom_button" android:layout_height="wrap_content"></Button>
    <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical">
        <TextView android:textAppearance="?android:attr/textAppearanceMedium" android:layout_width="wrap_content" android:text="" android:id="@+id/updates" android:textSize="14dp" android:layout_height="wrap_content"></TextView>
    </LinearLayout>
    <TextView android:text="" android:id="@+id/test" android:layout_width="wrap_content" android:layout_height="wrap_content"></TextView> 
</LinearLayout>
</LinearLayout>
 </ScrollView>

Upvotes: 4

Views: 4517

Answers (4)

Hussnain Ahmed
Hussnain Ahmed

Reputation: 61

Late but I've tried this solution.

Put a Linear layout inside scroll view and then give margin to Linear layout. After that add put your content inside linear layout. Hopefully this will solve issue.

   <androidx.core.widget.NestedScrollView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:scrollbars="vertical"
            >
            <androidx.appcompat.widget.LinearLayoutCompat
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical"
                android:layout_marginStart="@dimen/_10sdp"
                android:layout_marginEnd="@dimen/_10sdp"
                >

               //your content here

              </androidx.appcompat.widget.LinearLayoutCompat>
   </androidx.core.widget.NestedScrollView>

Upvotes: -1

user836200
user836200

Reputation: 655

I figured this out after chatting with the commonsguy (+1). I misunderstood the android error I received about scroll views and root elements. From my understanding, a scroll view can only have one child. My initial thought was that the scroll view needed to be surround the root element (oops). Here's the fix:

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

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/db1_root"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout style="@style/TitleBar">
        <ImageView style="@style/TitleBarLogo"
            android:contentDescription="@string/description_logo"
            android:src="@drawable/logo" />

        <ImageView style="@style/TitleBarSeparator" />
        <TextView style="@style/TitleBarText" />
        <ImageButton style="@style/TitleBarAction"
            android:contentDescription="@string/description_about"
            android:src="@drawable/about"
            android:onClick="onClickAbout" />
    </LinearLayout>

<LinearLayout
  android:orientation="vertical"
  android:layout_width="match_parent"
  android:layout_height="match_parent">
    <EditText 
        android:layout_width="match_parent" 
        android:id="@+id/status" 
        android:layout_height="wrap_content">
        <requestFocus></requestFocus>
    </EditText>
 <Button 
    android:layout_width="wrap_content" 
    android:text="Go" 
    android:textColor="@color/title_text" 
    android:layout_gravity="center" 
    android:id="@+id/communitysubmit" 
    android:background="@drawable/custom_button" 
    android:layout_height="wrap_content">
 </Button>
 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/ScrollView01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:fillViewport="true" >
    <LinearLayout 
        android:layout_width="match_parent" 
        android:id="@+id/linearLayoutcommunity" 
        android:layout_height="wrap_content" 
        android:orientation="vertical">
     <TextView 
        android:textAppearance="?android:attr/textAppearanceMedium" 
        android:layout_width="wrap_content" 
        android:text="" 
        android:id="@+id/updates" 
        android:textSize="14dp" 
        android:layout_height="wrap_content">
    </TextView>
    </LinearLayout>
    </ScrollView>
    <TextView 
        android:text="" 
        android:id="@+id/test" 
        android:layout_width="wrap_content" 
        android:layout_height="wrap_content">
    </TextView> 
</LinearLayout>
</LinearLayout>

Upvotes: 0

Paresh Mayani
Paresh Mayani

Reputation: 128448

This may work for you: android:scrollbarStyle="outsideOverlay", set this inside the <ScrollView>

Upvotes: 6

LuxuryMode
LuxuryMode

Reputation: 33771

Give your LinearLayout or your ScrollView some padding.

Upvotes: 0

Related Questions