I am a beginner in Android development. Currently, I am making an app for our project. In my app, I have this fragment with a TabLayout on the middle of the layout with a ViewPager below it. In my XML layout, I have set the height of the ViewPager to match_parent to fill in the remaining space underneath.
I have two fragments for the ViewPager, the first fragment contains a GridView and the other contains a ListView.
These views will be populated with data coming from my Firebase. Now what I did is to set the height of the ViewPager according to the height of the screen minus the height of the TabLayout along with the status bar, so that when the user scrolls to the very bottom, the TabLayout will be just underneath the app bar like they were merged together.
My problem is, after setting the height of the ViewPager programmatically, the NestedScrollView automatically scrolls to the very bottom. I have tested my app on Android 11 (API 30) and it worked well, but when I ran it on Android 5 (API 21), that's when I saw the scrolling problem.
I have also tried scrolling the NestedScrollView programmatically with nestedScrollView.fullScroll(View.FOCUS_UP) and nestedScrollView.scrollTo(0, 0) right after the height was set, but nothing seems to happen.
Here is my fragment layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/toolbar"
android:fitsSystemWindows="true"
android:theme="@style/AppTheme2">
<androidx.core.widget.NestedScrollView
android:id="@ id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:fillViewport="true"
android:overScrollMode="never">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="@ id/topLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<de.hdodenhof.circleimageview.CircleImageView
android:id="@ id/civ_profile_picture"
android:layout_width="125dp"
android:layout_height="125dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:scaleType="centerCrop"
android:src="@drawable/placeholder_profile_picture"
app:civ_border_color="@color/white"
app:civ_border_width="1dp"
tools:ignore="MissingConstraints" />
<RelativeLayout
android:id="@ id/layout_change_profile_picture"
android:layout_width="125dp"
android:layout_height="125dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:visibility="gone">
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#88000000"
app:civ_border_color="@color/white"
app:civ_border_width="1dp" />
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerInParent="true"
android:src="@drawable/ic_baseline_photo_camera_white_24" />
</RelativeLayout>
<EditText
android:id="@ id/type_edit"
android:layout_width="170dp"
android:layout_height="35dp"
android:layout_below="@id/username_edit"
android:layout_centerHorizontal="true"
android:gravity="center"
android:hint="type"
android:inputType="textNoSuggestions"
android:lines="1"
android:textAlignment="center"
android:textColor="@color/white"
android:textSize="14sp"
android:visibility="gone"
app:boxBackgroundMode="none" />
<EditText
android:id="@ id/username_edit"
android:layout_width="170dp"
android:layout_height="40dp"
android:layout_below="@id/civ_profile_picture"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:gravity="center"
android:hint="Username"
android:inputType="textNoSuggestions"
android:lines="1"
android:textAlignment="center"
android:textColor="@color/white"
android:textSize="20sp"
android:visibility="gone"
app:boxBackgroundMode="none" />
<TextView
android:id="@ id/Username"
android:layout_width="190dp"
android:layout_height="wrap_content"
android:layout_below="@id/civ_profile_picture"
android:layout_centerHorizontal="true"
android:layout_marginTop="8dp"
android:background="@null"
android:ellipsize="end"
android:fontFamily="@font/roboto"
android:gravity="center"
android:maxWidth="240dp"
android:maxLines="1"
android:scrollHorizontally="true"
android:text="Username"
android:textAlignment="center"
android:textColor="@color/white"
android:textSize="20dp" />
<TextView
android:id="@ id/TypesArtists"
android:layout_width="190dp"
android:layout_height="wrap_content"
android:layout_below="@id/Username"
android:layout_centerHorizontal="true"
android:layout_marginTop="5dp"
android:background="@null"
android:ellipsize="end"
android:fontFamily="@font/poppins"
android:gravity="center"
android:maxWidth="240dp"
android:maxLines="1"
android:scrollHorizontally="true"
android:text="Type"
android:textAlignment="center"
android:textColor="@color/gray_text_light"
android:textSize="14dp" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/TypesArtists"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:layout_marginBottom="20dp"
android:orientation="horizontal">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@ id/txt_rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="0.0"
android:textColor="@color/white"
android:textSize="18sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@ id/txt_rating"
android:layout_centerHorizontal="true"
android:layout_marginTop="4dp"
android:fontFamily="@font/poppins"
android:text="Rating"
android:textColor="@color/accent1"
android:textSize="14sp" />
</RelativeLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_marginHorizontal="20dp"
android:background="@color/divider_light" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@ id/txt_post_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="0"
android:textColor="@color/white"
android:textSize="18sp" />
<TextView
android:id="@ id/txt_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@ id/txt_post_count"
android:layout_centerHorizontal="true"
android:layout_marginTop="4dp"
android:fontFamily="@font/poppins"
android:text="Posts"
android:textColor="@color/accent1"
android:textSize="14sp" />
</RelativeLayout>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:layout_marginHorizontal="16dp"
android:background="@color/divider_light" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@ id/txt_reviews_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="0"
android:textColor="@color/white"
android:textSize="18sp" />
<TextView
android:id="@ id/txt_review"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@ id/txt_reviews_count"
android:layout_centerHorizontal="true"
android:layout_marginTop="4dp"
android:fontFamily="@font/poppins"
android:text="Reviews"
android:textColor="@color/accent1"
android:textSize="14sp" />
</RelativeLayout>
</LinearLayout>
<TextView
android:id="@ id/ratingTxt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/TypesArtists"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:fontFamily="@font/poppins"
android:text="rating 0/5"
android:textColor="@color/white"
android:textSize="14dp"
android:visibility="gone" />
<com.iarcuschin.simpleratingbar.SimpleRatingBar
android:id="@ id/rating_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/ratingTxt"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:layout_marginBottom="20dp"
android:visibility="gone"
app:srb_drawBorderEnabled="false"
app:srb_fillColor="@color/accent2"
app:srb_isIndicator="true"
app:srb_maxStarSize="14dp"
app:srb_numberOfStars="5"
app:srb_rating="5"
app:srb_starBackgroundColor="#172435"
app:srb_starSize="20dp"
app:srb_stepSize="0.5" />
</RelativeLayout>
<com.google.android.material.tabs.TabLayout
android:id="@ id/tab_layout"
android:layout_width="match_parent"
android:layout_height="48dp"
android:layout_below="@id/topLayout"
android:layout_centerInParent="true"
android:background="@color/item_dark"
android:outlineSpotShadowColor="@color/Magenta"
app:tabIndicatorColor="@color/Magenta"
app:tabIndicatorHeight="3dp"
app:tabSelectedTextColor="@color/white"
app:tabTextAppearance="@style/TabLayoutTextAppearance"
app:tabTextColor="@color/gray_text_dark"
tools:layout_editor_absoluteX="0dp" />
<androidx.viewpager.widget.ViewPager
android:id="@ id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@id/tab_layout"
android:background="@color/Background0" />
</RelativeLayout>
</androidx.core.widget.NestedScrollView>
</RelativeLayout>
And here is the method to set the height of the ViewPager:
private void setViewPagerParams() {
tabLayout.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
tabLayout.getViewTreeObserver().removeOnGlobalLayoutListener(this);
//get height of tab layout (px)
int tabLayoutHeight = tabLayout.getHeight();
//get height of screen (px)
Display display = getActivity().getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
//get height of status bar
Rect rectangle = new Rect();
Window window = getActivity().getWindow();
window.getDecorView().getWindowVisibleDisplayFrame(rectangle);
int statusBarHeight = rectangle.top;
heightOfViewPager = size.y - (tabLayoutHeight statusBarHeight);
ViewGroup.LayoutParams viewPagerParams = viewPager.getLayoutParams();
viewPagerParams.height = heightOfViewPager;
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(viewPagerParams);
params.addRule(RelativeLayout.BELOW, R.id.tab_layout);
viewPager.setLayoutParams(params);
}
});
}
CodePudding user response：
Update:
After hours of research and code fiddling, turns out my problem was in my XML file.
I changed the root element from RelativeLayout to LinearLayout, and added android:descendantFocusability="blocksDescendants" as its attribute.
This answer helped me
Another update: Although the scrolling stopped, the root layout LinearLayout stops all its descendant views from being focused making it prevent all inputs on the EditText contained in it. The better solution is setting the android:focusableInTouchMode attribute to true, so that the edit text can still be focusable while preventing the unwanted scrolling.