How to update divider to the right place in a RecyclerView? - java

I wrote the following layout:
<?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="wrap_content"
android:orientation="vertical">
<ImageView
android:id="#+id/avatar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp" />
<TextView
android:id="#+id/full_name"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/avatar"
android:layout_toEndOf="#id/avatar"
android:textSize="20sp"
android:textColor="#color/blackColor"
android:layout_centerVertical="true" />
<!-- Divider -->
<View
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/avatar"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp" />
</RelativeLayout>
It's the item layout of the RecyclerView. Basicly it creates the following layout:
[avatar] [name]
---------------------
[avatar] [name]
---------------------
[avatar] [name]
The Java code:
public void onBindViewHolder(ViewHolder holder, int position) {
// Code
// Set avatar
// Set name
holder.fullname.setText((CharSequence) name);
// Set visible/invisible divider
if (position < getItemCount() - 1) {
holder.viewDivider.setVisibility(View.VISIBLE);
} else {
holder.viewDivider.setVisibility(View.GONE);
}
}
The problem is that the divider is being set on top of the ImageView and the TextView and not on the bottom of each block. I think that I understand why it happens - the divider is already there so when I set ImageView and TextView dynamically, the divider is not being rendered to the right place. Or maybe it's related to android:layout_centerVertical? How should I fix it?
Also, In the activity which sets the adapter I call:
holder.users.setLayoutManager(new LinearLayoutManager(this.activity));
Is it ok that I call LinearLayoutManager when the layout (of the item) is RelativeLayout?

<!-- Divider -->
<View
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/avatar"
android:layout_centerVertical="true" <-- REMOVE THIS LINE :)
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp" />

Maybe you should enclose your image and textview in a layout preferably in a relative layout and then take a view and below that layout 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="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/rlLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/avatar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp" />
<TextView
android:id="#+id/full_name"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/avatar"
android:layout_toEndOf="#id/avatar"
android:textSize="20sp"
android:textColor="#000000"
android:text="Test String"
android:layout_centerVertical="true" />
</RelativeLayout>
<!-- Divider -->
<View
android:id="#+id/divider"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/colorPrimary"
android:layout_below="#+id/rlLayout"
android:layout_centerVertical="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp" />
</RelativeLayout>

Related

How to make a grid where each attribute is a textview underneath another textview

I'm trying to create a 4*n grid where each attribute within the grid has a textView saying "1" then directly underneath that text view saying "One"
e.g.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="8dp"
android:paddingBottom="8dp">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:rowCount="2">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:textSize="30dp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="One"
android:textSize="32sp" />
</GridLayout>
This just provides each text view next to each other in a grid.
Any help would be greatly appreciated.
Thank you.
you should create your row layout file like this,
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="8dp"
android:paddingBottom="8dp">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:textSize="30dp" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="One"
android:textSize="32sp" />
</LinearLayout>
inflate this row file in the adapter and set the not of items in each row for grid to 4.
one suggestion - user recyclerview with GridLayoutManager instead of GridLayout.

overlap cardview over image

I am new to android programming and I am trying to slide my view over image.This is my code(Not sure if this is the right way)
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ron"
android:scaleType="fitCenter"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="#+id/cv">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_photo"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_name"
android:layout_toRightOf="#+id/person_photo"
android:layout_alignParentTop="true"
android:textSize="30sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_age"
android:layout_toRightOf="#+id/person_photo"
android:layout_below="#+id/person_name"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
I want to scroll my cardview over image keeping image fixed.something like eclipsing the image.
and after scrolling completely the image should get hidden.(I dont want it to flow under toolbar)
Try to place your CardView into ScrollView and add CardView's marginTop which equals to your Image's height.

LinearLayout: 3 Elements, Top, Center, Bottom

I've the following xml file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/topFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center">
<ImageView
android:id="#+id/imageViewTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_00" />
<TextView
android:id="#+id/textViewTest"
android:layout_below="#+id/imageViewTest"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is a Test"/>
</RelativeLayout>
<FrameLayout
android:id="#+id/bottomFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal" />
</LinearLayout>
The first FrameLayout contains a fragment, which contains some buttons.
The RelativeLayout contains for example an image (changig size) and a text.
The last FrameLayout contains also a fragment, which contains either some buttons or some text or an image.
My aim is, that:
- the first FrameLayout is on top (that works)
- the elements in the RelativeLayout are centered in the middle of the screen (doesn't work)
- the last FrameLayout is on the bottom (doesn't work)
It should look like this:
My previous attempts with android:gravity="center" in the RelativeLayout and android:layout_gravity="bottom|center_horizontal" for the second FrameLayout failed.
Change the LineareLayout to Relative and use layout_centerInParent for the middle layout and alignParentBottom for the last one.
The top View will be anchored to the top by default
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"> //removed orientation as it won't be needed anymore
<FrameLayout
android:id="#+id/topFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="wrap_content" // change here
android:layout_height="wrap_content"
android:layout_centernInParent="true"> // here
<ImageView
android:id="#+id/imageViewTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_00" />
<TextView
android:id="#+id/textViewTest"
android:layout_below="#+id/imageViewTest"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is a Test"/>
</RelativeLayout>
<FrameLayout
android:id="#+id/bottomFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" /> //here
</RelativeLayout>
Use relative layout and use android:layout_centerHorizontal="true" instead of gravity.
EDIT
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/topFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/topFragment">
<ImageView
android:id="#+id/imageViewTest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/icon_00"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/textViewTest"
android:layout_below="#+id/imageViewTest"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is a Test"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<FrameLayout
android:id="#+id/bottomFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Android Custom ViewGroup not rendering correctly

I have a ViewGroup that has the following xml layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/ticketBuy_viewLayout"
android:paddingLeft="16dp"
android:paddingRight="16dp">
<ImageView
android:id="#+id/ticketBuy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" />
<TextView
android:id="#+id/ticketBuy_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/ticketBuy_icon"/>
<TextView
android:id="#+id/ticketBuy_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/ticketBuy_icon"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"/>
</RelativeLayout>
Later, I put these Views into a ListView. And, well, don't really get the desired result.
What I want it to be is a small rectangular view with an image to the left, a title to the top right and the date to the bottom left. I am not posting the ListView xml because it does not have anything that would be of use (just a width and height set to match_parent) However, all I get is this (This ListView has about 8 elements):
I think you just messed up with the layout.
Try this layout :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/ticketBuy_viewLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="16dp"
android:paddingRight="16dp" >
<ImageView
android:id="#+id/ticketBuy_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="5dp"
/>
<TextView
android:id="#+id/ticketBuy_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/ticketBuy_icon"
/>
<TextView
android:id="#+id/ticketBuy_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_toRightOf="#id/ticketBuy_name"
/>
</RelativeLayout>

Bring content of FrameLayout to front

I have this activity layout where I have a header (RelativeLayout), content (FrameLayout) and a footer (RelativeLayout) all inside a LinearLayout (please refer to the attached screenshot below) :
The problem is that sometimes when content (which is actually a Fragment) is large enough, it gets clipped by the footer (e.g. in the attached image one can see that some button are being clipped). I have tried setting the background of footer layout to transparent (via xml and via code as well), calling the FrameLayout.bringToFront() method but nothing seems to work!
Pasted below is the layout xml I am using:
<?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:id="#+id/layoutMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical"
tools:context=".BatwaSelectLanguage" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutHeader"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top" >
<ImageView
android:id="#+id/imBatwa"
android:layout_width="209dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginTop="20dp"
android:src="#drawable/batwa" />
<Spinner
android:id="#+id/spLang"
android:layout_width="140dp"
android:layout_height="60dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="30dp"
android:layout_marginTop="20dp"
android:background="#000000"
android:prompt="#string/english" />
<TextView
android:id="#+id/tvSelectLanguage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"
android:layout_marginTop="20dp"
android:layout_toLeftOf="#+id/spLang"
android:drawablePadding="30dp"
android:drawableRight="#drawable/line"
android:gravity="center"
android:text="#string/select_your_language"
android:textColor="#color/tvWhite"
android:textSize="#dimen/tvSizeSelectLang" />
</RelativeLayout>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</FrameLayout>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutFooter"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom" >
<ImageView
android:id="#+id/imNFC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="0dp"
android:layout_marginLeft="30dp"
android:contentDescription="#string/nfcimg"
android:src="#drawable/nfc" />
<ImageView
android:id="#+id/imNadra"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginBottom="00dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/nadra"
android:src="#drawable/nadralogo" />
</RelativeLayout>
</LinearLayout>

Categories