What I have so far
I have a recyclerview and buttons below it. On initial state everything looks good: recyclerview makes space for a button and I can scroll down to the end of the list and the last item won't be hidden by the button. When I pick one of the items, one button becomes invisible and other buttons become visible.
Actual behavior
When buttons change their visibility, recyclerview fills parent, so part of the content is being hidden under the recently appeared buttons.
Expected behavior
I expect that recyclerview will shrink its height leaving some space for the buttons.
What I've tried to do
I've tried to apply this to a swiperefreshlayout:
android:layout_height="0dp"
android:layout_weight="1"
but now recyclerview will just disappear when first button hides and others show up.
Layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent">
<include
layout="#layout/toolbar_actionbar" />
<TextView
android:gravity="center"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_centerInParent="true"
android:layout_gravity="center|center"
android:maxLines="10"
android:textSize="20dp"
local:MvxBind="Text EmptyMessage;Visibility Visibility(ShowEmptyMessage)" />
<MvvmCross.Droid.Support.V4.MvxSwipeRefreshLayout
android:id="#+id/timeslotsSwipeRefresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/getTimeslotButton"
android:layout_below="#+id/appbar"
local:layout_behavior="#string/appbar_scrolling_view_behavior"
local:MvxBind="Refreshing IsRefreshingTimeslots; RefreshCommand RefreshTimeslotsCommand">
<!-- Here is my recycler view -->
<MvxRecyclerView
android:id="#+id/MyTimeslotsRecyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
local:MvxBind="ItemsSource Timeslots;Visibility Visibility(ShowList)"
local:MvxItemTemplate="#layout/item_my_timeslot" />
</MvvmCross.Droid.Support.V4.MvxSwipeRefreshLayout>
<!-- Here is my disappearing button -->
<android.support.v7.widget.AppCompatButton
android:id="#+id/getTimeslotButton"
android:text="Получить таймслоты"
android:theme="#style/ButtonPrimary"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
local:MvxBind="Click GetTimeslotsCommand; Visibility InvertedVisibility(IsEditModeEnabled)" />
<!-- Here are my appearing buttons.
I placed it inside of a relativelayout
to make a single visibility data binding -->
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
local:MvxBind="Visibility Visibility(IsEditModeEnabled)">
<android.support.v7.widget.AppCompatButton
android:id="#+id/copyToSmsButton"
android:text="Отправить по SMS"
android:theme="#style/ButtonPrimary"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_marginBottom="0dp"
android:layout_alignParentLeft="true"/>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_below="#id/copyToSmsButton">
<android.support.v7.widget.AppCompatButton
android:id="#+id/deleteTimeslotButton"
android:text="Удалить"
android:theme="#style/ButtonSecondary.Red"
android:layout_marginTop="0dp"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"/>
<android.support.v7.widget.AppCompatButton
android:id="#+id/moveTimeslotButton"
android:text="Перенести"
android:theme="#style/ButtonSecondary"
android:layout_marginTop="0dp"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
Related
I have the following (Relative) layout (from top to bottom):
Top bar with an icon which opens an options menu
Hidden menu which is set to Visibility.GONE until it is opened
RecyclerView beneath, it takes up the remainder of the screen
So in the beginning, only the top bar and the RecyclerView are visible.
When I click to display the hidden menu, it opens up and lowers the RecyclerView down to make space for itself. If I click on the buttons inside of this hidden menu, they work. The tricky part is, if I click on empty space between those buttons (screen area where the RecyclerView elements USED to be), the click is passed on to a certain RecyclerView element.
So instead of nothing happening because I clicked on empty space, my clicks get passed on to the RecyclerView which used to be there before the options menu popped up.
I am not using animations, only view.visibility = View.VISIBLE
Edit: Let me know if you guys need some photos for better understanding.
Here is my XML:
<!-- TOP BAR -->
<RelativeLayout
android:id="#+id/topBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="47dp">
<ImageButton
android:id="#+id/topBarButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginStart="10dp"/>
</RelativeLayout>
<!-- RecyclerView -->
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_below="#id/hiddenMenu"/>
<!-- Hidden menu -->
<RelativeLayout
android:id="#+id/hiddenMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/topBar"
android:orientation="vertical"
android:visibility="gone">
<EditText
android:id="#+id/hiddenMenutext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is some text" />
<ImageView
android:id="#+id/hiddenMenuImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
Can u try this..... if not solved share the exact issue with images/Gif.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/lltop"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/topBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="47dp">
<ImageButton
android:id="#+id/topBarButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginStart="10dp"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/hiddenMenu"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="gone">
<EditText
android:id="#+id/hiddenMenutext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is some text" />
<ImageView
android:id="#+id/hiddenMenuImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
/>
</RelativeLayout>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_below="#+id/lltop"
android:layout_height="match_parent"
android:padding="#dimen/item_margin"
android:clipToPadding="false"/>
</RelativeLayout>
I have a SearchView inside my Layout. In this layout, I have my ListView associate with the SearchView. When I edit my SearchView, I have the right result.
But I what my ListView to over the other element of my screen (such as a button). How do I do that ?
I see that it's what's done on iOS.
to sum up : I need the listView to be under my searchView AND in front of all other element (the list does not have to move down the reste of my layout)
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="20dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginBottom="10dp"
android:id="#+id/layoutDepart">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#drawable/background_input_no_padding"
android:weightSum="1"
android:id="#+id/layoutSearchViewDepart">
<android.support.v7.widget.SearchView
android:id="#+id/searchDepart"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
app:iconifiedByDefault="false"
app:defaultQueryHint="Arrêt de départ"
app:queryHint="Arrêt de départ"
android:layout_weight="0.95"
android:padding="0dp"
android:layout_margin="0dp"
>
<SearchView
android:layout_width="wrap_content"
android:layout_height="match_parent"
/>
</android.support.v7.widget.SearchView>
<View
android:layout_width="1dp"
android:layout_height="match_parent"
android:background="#3a4770"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
tools:ignore="UseCompoundDrawables"
android:tag="favArretItineraire"
android:id="#+id/favDepart"
android:layout_gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="#string/mes_favoris"
android:textColor="#color/bleuFonce"
android:gravity="center"
android:paddingStart="10dp"
android:paddingEnd="10dp"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_star_yellow_24dp"
android:contentDescription="#string/mes_favoris"
android:layout_gravity="center"
/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="#+id/resSelectionLigneDepart"
android:visibility="visible"
android:background="#color/grayBg"
android:layout_below="#id/layoutSearchViewDepart"
>
<ListView
android:id="#+id/listSearchViewDepart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:divider="#null"
android:dividerHeight="0dp"
android:visibility="gone"
android:translationZ="15dp"/>
</LinearLayout>
</RelativeLayout>
</LinearLayout>
When deciding what view to draw on top, android respects two things:
order in which views appear in the layout (next one is drawn over
previous one)
Z-coordinates - view with higher Z is drawn over view with lower Z
Note!
Old devices (below 21) do not use Z-order, only view order.
New devices (21 and above) use Z-order first and (for views with equal Z-coords) view order.
Your layout may look like this:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="20dp">
<FrameLayout
android:id="#+id/behindListViewWrapper"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- here goes everything that should be behind listview, for example button -->
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="A button behind"
android:layout_gravity="center"
android:background="#f00"/>
</FrameLayout>
<ListView
android:id="#+id/listSearchViewDepart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#7000"
android:divider="#null"
android:dividerHeight="0dp"/>
<android.support.v7.widget.SearchView
android:id="#+id/searchDepart"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff"
app:defaultQueryHint="Arrêt de départ"
app:iconifiedByDefault="false"
app:queryHint="Arrêt de départ"/>
</FrameLayout>
Why Button is wrapped in additional FrameLayout?
Because widgets can have default Z-coords. For button Z is equal 2 in normal state and 8 in pressed state (see https://material.io/design/environment/elevation.html). So in all cases the button will be drawn on top.
But that can be bypassed by wrapping button in other layout.
When desiding what to draw next, layout looks only for its direct children, not whole hierarchy. In this case all children have Z equal to 0, therefore behindListViewWrapper is the first to draw, then listview, then searchview.
If the button was not wrapped, it would be drawn on top (on modern devices, because of Z) or behind (on old devices, because of view ordering).
I am sitting a long time to get my layout working. There should be an EditText on top. A RecyclerView after that. An ImageButton after that. At the bottom of the activity should be a Button. This looks fine. There is a Space between the ImageButton and Button which has height=0dp and weight=1. Rest has height=wrap_content.
When I open up the keyboard, the RecyclerView keeps being full-sized. This doesnt look fine. I want it to make space to let the Buttons fit on the screen. It should be like that
I tried to make the RecyclerView height=0dp too, but then the Space doesnt work as it should. Their height would depend on each other weight. When I remove the Space and try to get the Button to the bottom while Recyclerview has height=0dp, it would fill the entire free space, so the ImageButton would stick to the Button instead of to the end of the list.
If I would put the ImageButton as the last element of the RecyclerView, it wouldnt be always on the screen when the List is too long.
Layout-XML-only solution would be appreciated.
#edit: My layout breaks completely when I add more items. This should be fixed with the same approach.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context=".ui.edit.EditActivity">
<EditText
android:id="#+id/et_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:hint="#string/enter_name"
android:inputType="text|textAutoComplete|textAutoCorrect|textShortMessage"
android:maxLength="25" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:scrollbars="vertical"
app:layoutManager="android.support.v7.widget.LinearLayoutManager">
</android.support.v7.widget.RecyclerView>
<ImageButton
android:id="#+id/bt_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="8dp"
android:background="#null"
app:srcCompat="#drawable/twotone_add_circle_24" />
<Space
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/bt_save"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="save" />
</LinearLayout>
you can give weight to recyclerview
like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical">
<EditText
android:id="#+id/et_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:hint="enter name"
android:inputType="text|textAutoComplete|textAutoCorrect|textShortMessage"
android:maxLength="25" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_margin="8dp"
android:layout_weight="1"
android:scrollbars="vertical"
app:layoutManager="android.support.v7.widget.LinearLayoutManager">
</android.support.v7.widget.RecyclerView>
<ImageButton
android:id="#+id/bt_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_margin="8dp"
android:background="#null"
app:srcCompat="#drawable/ic_delete" />
<Space
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<Button
android:id="#+id/bt_save"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="save" />
</LinearLayout>
I set the ScrollView in my LinearLayout. I want a TextView to scroll. I tried to use ScrollView in xml like this. But, it's not working.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="8dp"
tools:context=".SubpagesLayout.ReportResult">
<!-- first scrollView -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/edit_corner_blue"
android:gravity="center"
android:text="#string/personalInformation"
android:textColor="#android:color/white" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/birthDate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" TestData" />
</LinearLayout>
<!-- second scrollView -->
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/textOphthalmoscopy"
android:layout_width="match_parent"
android:layout_height="80dp"
android:text="standard instrth various settings that allow focusing and adjustment of the light source to accommodate the viewer and to evaluate various features of the fundus." />
</ScrollView>
</LinearLayout>
</ScrollView>
</LinearLayout>
I tried another way like this, but it's still not working too.
android:maxLines = "AN_INTEGER"
android:scrollbars = "vertical"
I used
myTextView.setMovementMethod(new ScrollingMovementMethod());
So how to let TextView to scroll? If it is the second ScrollView.
You might consider using a NestedScrollView along with a ListView for showing the scrollable TextView.
The ListView will have a fixed size so that it'll not take the total height of the items inside.
So the layout may look like this.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="8dp"
tools:context=".SubpagesLayout.ReportResult">
<!-- first scrollView -->
<NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/edit_corner_blue"
android:gravity="center"
android:text="#string/personalInformation"
android:textColor="#android:color/white" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/birthDate" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=" TestData" />
</LinearLayout>
<ListView
android:layout_width="match_parent"
<!--set a fixed height-->
android:layout_height="80dp"
.. Other attributes
</ListView>
</LinearLayout>
</NestedScrollView>
</LinearLayout>
And the list item of the ListView may contain the TextView you want to scroll. Set the height of the TextView to wrap_content.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="8dp"
tools:context=".SubpagesLayout.ReportResult">
<TextView
android:id="#+id/textOphthalmoscopy"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="standard instrth various settings that allow focusing and adjustment of the light source to accommodate the viewer and to evaluate various features of the fundus." />
</LinearLayout>
Now your ListView will have a single item and this will scroll with the default behaviour of list.
The whole layout will be scrolled via NestedScrollView.
Hope that helps!
Having a scrollView inside another scrollView is not a good prictice but ant a you check below links it may fix you problem.
Solution 1
Solution 2
I have a few EditTexts in my RelativeLayout, and a button aligned at the bottom of it. When the keyboard pops up, I want my layout to resize (therefore, I'm using android:windowSoftInputMode="adjustResize") and also want it to be scrollable, because in smaller screens resizing it isn't enough.
The problem is I can't get it to scroll at all!
I do need the Button to stay at the bottom of the screen.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFF">
<!-- some hidden RelativeLayouts, filling the whole screen -->
<RelativeLayout
android:id="#+id/form_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent" android:layout_height="match_parent"
android:fillViewport="true" android:layout_above="#+id/ok_btn">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" android:background="#99000000" android:visibility="visible">
<View
android:id="#+id/shade"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_alignTop="#+id/logradouro1"
android:background="#FFF" android:layout_marginTop="-30dp"/>
<!-- some visible EditTexts and TextViews here -->
</RelativeLayout>
</ScrollView>
<Button android:id="#+id/ok_btn"
android:layout_width="match_parent"
android:layout_height="50dp" android:background="#color/verdeBotao" android:text="Cadastrar"
android:textColor="#FFF" android:layout_alignParentBottom="true"/>
</RelativeLayout>
</RelativeLayout>
Below are 2 screenshots to illustrate what is happening. Please notice that I can't scroll when the keyboard is up.
Thanks!
i am posting something similar to your ui. take a RelativeLayout for the button at the bottom. set gravity to bottom and your button view should android:layout_alignParentBottom="true"
<ScrollView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/m_table_menu" >
<LinearLayout
android:id="#+id/layuserdetails"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:orientation="horizontal"
android:padding="5dp" >
Yourviewss......i guess edittexts
</LinearLayout>
</ScrollView>
//scrollable Button layout
<RelativeLayout
android:id="#+id/m_table_menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="bottom"
android:padding="0dp" >
<LinearLayout
android:id="#+id/laysharepost"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="bottom"
android:orientation="vertical"
android:padding="5dp" >
//replace textview with buttonview..
<TextView
android:id="#+id/share_tvcommentdone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/button_selector"
android:padding="10dp"
android:text="POST"
android:textColor="#android:color/white" />
</LinearLayout>
</RelativeLayout>