AndroidSlidingUpPanel shows full screen when RecyclerView empty

AndroidSlidingUpPanel shows full screen when RecyclerView empty - android

I have the following problem. I am using:
AndroidSlidingUpPanel
which is exactly what I need.
I have a sliding in recyclerview from the bottom of the screen.
I set the view to wrap_content, so that if there is one item in the list, the view will only drag up to show one item. If there are more items, it will always only drag up to show the content. Great.
However I have one problem, when the list is empty, the view then drags up to take up the entire screen. In this case when the list is empty, I don't want it to drag at all.
Here is my xml of the main activity:
<com.sothree.slidinguppanel.SlidingUpPanelLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:sothree="http://schemas.android.com/apk/res-auto"
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="bottom"
sothree:umanoPanelHeight="80dp"
sothree:umanoShadowHeight="4dp"
sothree:umanoParallaxOffset="100dp"
sothree:umanoDragView="#+id/dragView"
sothree:umanoOverlay="true"
sothree:umanoScrollableView="#+id/myplaces_recycler_view">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fab="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">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.berman.reuven.myplaces.MapsActivity" />
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#ffffff"
android:clickable="true"
android:focusable="false"
android:id="#+id/dragView">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:background="#color/my_new_background_lighter"
android:orientation="vertical"
android:gravity="center"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="My Places"
android:id="#+id/textViewTitleList" />
<TextView
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/textViewNotesList" />
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/myplaces_recycler_view"
android:scrollbars="vertical"
android:layout_height="wrap_content"
android:layout_width="match_parent"
/>
</LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
Here is the xml of the item in the recycler view:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="80dp"
android:gravity="center_vertical"
android:padding="10dp"
android:clickable="true"
android:focusable="true"
android:id="#+id/item_background"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="#+id/textViewTitle" />
<TextView
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:text="Large Text"
android:id="#+id/notesTextView" />
</LinearLayout>

Related

How do you position views and other UI items in a fragment layout?

I have a message interface consisting of a listview, an edit text box and a button found in a tutorial online. In my implementation of the xml it lays out perfectly with the listview above the text box and button. However, when I try to implement the layout using two fragments (1) for an audio player at the top of the screen and (2) below that for the messaging, I cannot force the text box and button to display below the list view.
How can I do that below are the XMLs.
(1) Works as expected:
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context=".MainActivity"
>
<ListView
android:id ="#+id/message_list"
android:layout_weight="100"
android:layout_width="match_parent"
android:layout_height="0dp"
android:divider="#null"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/new_message"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="100"
android:inputType="text">
<requestFocus />
</EditText>
<Button
android:id="#+id/send_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:text="#string/send_message"
android:textColor="#android:color/white" />
</LinearLayout>
</LinearLayout>
(2) Positions the text and button at the top of or near the top of the list view:
<?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:orientation="vertical">
<ListView
android:id="#+id/message_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#null" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/new_message"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="100"
android:inputType="text"
android:labelFor="#id/new_message" />
<Button
android:id="#+id/send_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:text="#string/send_message"
android:textColor="#android:color/white" />
</LinearLayout>
</RelativeLayout>
Changing (2) to linear layout has not fixed my issue.

This somehow fixed my problem although it seemed not to have worked before.
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context="com.example.app.MessageFragment">
<ListView
android:id ="#+id/message_list"
android:layout_weight="100"
android:layout_width="match_parent"
android:layout_height="0dp"
android:divider="#null"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/new_message"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="100"
android:inputType="text"
android:labelFor="#id/new_message" />
<Button
android:id="#+id/send_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:text="#string/send_message"
android:textColor="#android:color/white" />
</LinearLayout>
</LinearLayout>

Your second layout has no constraints. You should make sure that your LinearLayout is aligned bottom and the listview is above the LinearLayout. It should be something like this :
<?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:orientation="vertical">
<ListView
android:id="#+id/message_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/llText"
android:divider="#null" />
<LinearLayout
android:id="#+id/llText"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content">
<EditText
android:id="#+id/new_message"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="100"
android:inputType="text"
android:labelFor="#id/new_message" />
<Button
android:id="#+id/send_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:text="Hello"
android:textColor="#android:color/white" />
</LinearLayout>
</RelativeLayout>

How do I get an imageView and textview to both fill the layout when setting bitmap programmatically?

What I want is for qrcodetext to fit and display all the text in qrcode_layout and have qrimageView to fill the rest of qrcode_layout? But my layout below has the entire qrimageView cover qrcode_layout. I tried a bunch of other variations but without success.
Here is what it looks like.
Here is what I want it to look like.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</RelativeLayout>

Use following code. Align your textview to bottom and then align your Qrcode Image above text:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_alignParentBottom="true"
android:layout_marginTop="4dp" />
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_above="#id/qrcodetext"
android:layout_alignParentTop="true"
android:layout_marginTop="8dp" />
</RelativeLayout>

I think what i have understand you want is below: Plz check and tell me:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:id="#+id/qrcodelayout">
<TextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:id="#+id/qrcodetext"
android:gravity="center"
android:layout_weight="1"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp" />
<LinearLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/qrimageView"
android:layout_gravity="center_horizontal"
android:layout_marginTop="8dp" />
</LinearLayout>
</LinearLayout>
<!--<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>-->
</RelativeLayout>

Shared Element Transition + Content Transition

I am trying to achieve something real similar to the gif that can be seen in the following link:
Shared Element Transitions Between Views (not Activities or Fragments)
The only difference between that the transition needs to take place when there is an click event on a recyclerview item which is within an fragment (The fragment resides within an activity). The onClick then propogates to an activity which in turn hosts the actual fragment consisting of the details.
How can we go about achieving such animation?
For reference this is what my details xml looks like:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:id="#+id/card_view"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dip">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/holo_green_dark"
android:layout_margin="10dip"
android:id="#+id/detailsCardTitleNameTextView"
/>
<include layout="#layout/divider_details"/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:text = "#string/director_name"
android:layout_margin="10dip"
android:id="#+id/detailsCardDirectorTextView"
/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:layout_margin="10dip"
android:text="#string/released_date"
android:id="#+id/detailsCardReleasedTextView"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/card_view5"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dip">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/holo_green_dark"
android:layout_margin="10dip"
android:text="#string/writers_title"
android:id="#+id/detailsCardWriterTitleTextView"
/>
<include layout="#layout/divider_details"/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:layout_margin="10dip"
android:id="#+id/detailsCardWritersTextView"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/card_view2"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dip">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/holo_green_dark"
android:text="#string/plot_title"
android:layout_margin="10dip"
android:id="#+id/detailsCardPlotTitleTextView"
/>
<include layout="#layout/divider_details"/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:layout_margin="10dip"
android:id="#+id/detailsCardPlotTextView"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/card_view3"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dip">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="wrap_content">
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/holo_green_dark"
android:layout_margin="10dip"
android:text="#string/imdb_rating"
android:id="#+id/imdbRatingTitleTextView"
/>
<include layout="#layout/divider_details"/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textColor="#android:color/black"
android:layout_margin="10dip"
android:id="#+id/imdbRatingTextView"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Any ideas, tips much appreciated.
Thanks!

ExpandableListView change the expanding mode to horizontally

I am trying to change the way in which ExpandableListView expands.
The default is vertically, but i want it to expand horizontally!
Something like this (http://developer.android.com/design/patterns/multi-pane-layouts.html), but this uses multi-pane.
What I want to do is that when the parent is clicked, the child will expand in line with the parent, not under it.
Default is:
Parent1
Child1
Parent2
Child2
What I want is:
Parent1 Child1
Parent2 Child2
Main.xml:
<RelativeLayout 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"
tools:context="com.example.list"
android:background="#141214"
>
<ExpandableListView android:id="#+id/list"
android:layout_height="match_parent"
android:layout_width="200dp"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginTop="?android:attr/actionBarSize"
android:smoothScrollbar="true"
android:fadingEdge="vertical"
/>
Parent_View.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<CheckedTextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/textViewGroupName"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="#string/hello_world"
android:textSize="18sp"
android:textColor="#FFFFFF"
android:padding="30dp"
android:textSelectHandleLeft="#string/hello_world"
android:background="#009999"
android:textStyle="bold"
/>
Child View.xml:
<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="40dp"
android:background="#99D6D6"
android:orientation="vertical"
android:paddingLeft="40dp"
android:paddingRight="0dp"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="39dp"
android:gravity="center_vertical" >
<TextView
android:id="#+id/textViewChild"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="#string/hello_world"
android:textSize="16sp"
android:textColor="#1919A3"
android:textStyle="bold" />
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#android:color/white" />
</LinearLayout>
So is there any way to modify the ExpandableListView properties so that the children will be shown in line with parents?
Any ideas?
Thank you

Can't click children button in SlidingUpPanelLayout

I use SlidingUpPanelLayout in my project and i have a problem with it.
My SlidingUpPanelLayout has 2 children.
1) ListView for showing list of data - this is content
2) LinearLayout with his children (textvien, edittext, button) - this is slide up panel
When SlidingUpPanelLayout is showing i try to click on my button, and my SlidingUpPanelLayout immediately close, and i can't click on my button and edittext.
How can i get rid of this?
how can i setup click/show up panel on some View?
thanks!
<?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">
<com.sothree.slidinguppanel.SlidingUpPanelLayout
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ListView
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:divider="#drawable/shape_divider_comments"
android:dividerHeight="1dp"
android:id="#+id/lvReviews"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
<LinearLayout
android:id="#+id/rlSlidingContent"
android:gravity="center|top"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<ScrollView
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
style="#style/StyleEditText"
android:id="#+id/etPersonName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/your_name_hint"
android:inputType="textPersonName" >
</EditText>
<Button
style="#style/StyleButton"
android:visibility="visible"
android:id="#+id/btnAddComment"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Add" />
</LinearLayout>
</ScrollView>
</LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
</RelativeLayout>

Check out the method setDragView it represents the "handle" of the drawer.
Also, check the overdraw of your views, you could simplify your layout,
for example:
<com.sothree.slidinguppanel.SlidingUpPanelLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/lvReviews"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#drawable/shape_divider_comments"
android:dividerHeight="1dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:visibility="gone" />
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:visibility="visible">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:id="#+id/etPersonName"
style="#style/StyleEditText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="#string/your_name_hint"
android:inputType="textPersonName">
</EditText>
<Button
android:id="#+id/btnAddComment"
style="#style/StyleButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Add"
android:visibility="visible" />
</LinearLayout>
</ScrollView>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
renders the same with far less overdraw

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

AndroidSlidingUpPanel shows full screen when RecyclerView empty - android

Related

How do you position views and other UI items in a fragment layout?

How do I get an imageView and textview to both fill the layout when setting bitmap programmatically?

Shared Element Transition + Content Transition

ExpandableListView change the expanding mode to horizontally

Can't click children button in SlidingUpPanelLayout

Categories

Resources