Develop Reference

Parent view is overlapped by child view

I am developing an Android application in which I would like to display the GridView using RecyclerView.
I could able to create separate layout for an item and display it in GridView dynamically.But I face an issue in showing tick mark on top right of each item.
The tick mark is hidden by CardView
Here is my item_grid.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="110dp"
android:layout_height="110dp">
<android.support.v7.widget.CardView
android:id="#+id/cardView2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_marginTop="10dp"
android:elevation="#dimen/activity_horizontal_margin">
<ImageView
android:id="#+id/image_hobby_bg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:src="#drawable/cycling" />
<TextView
android:id="#+id/text_hobby_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/colorAccent"
android:gravity="center"
android:padding="3dp"
android:paddingBottom="15dp"
android:paddingTop="15dp"
android:text="CYCLING"
android:textColor="#android:color/white"
android:textSize="12sp"
android:textStyle="bold" />
</android.support.v7.widget.CardView>
<ImageView
android:id="#+id/image_hobby_selected_icon"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="top|right"
android:adjustViewBounds="true"
android:src="#drawable/all_checked_round" />
</FrameLayout>
I have tried bringToFront() method but it is not working.
viewHolder.checkMark.bringToFront();
((View) viewHolder.checkMark.getParent()).invalidate();
(viewHolder.checkMark.getParent()).requestLayout();
Please help me find the solution.

Please use elevation.
If your card view has elevation as 10dp, then set elevation in imageView as 11dp.
<ImageView
android:id="#+id/image_hobby_selected_icon"
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_gravity="top|right"
android:adjustViewBounds="true"
android:src="#drawable/ic_camera"
android:elevation="13dp"
/>

How to add 3D drawable effect to layout in GridView?

I'm building a GridView that fills itself (with 'tiles') by using a custom GridAdapter. Now I'm trying to add a effect to each tile, the effect is shown in the red circle:
This is what I have now:
The layout file, tile.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="180dp"
android:layout_height="180dp"
android:background="#drawable/tile_background"
android:id="#+id/frameItem"
android:layout_weight="1">
<ImageView
android:id="#+id/tile_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:scaleType="fitXY"
android:src="#drawable/big_image"
android:gravity="start"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_above="#+id/tile_title" />
<ImageView
android:id="#+id/image_small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/tile_arrow"
android:layout_alignParentBottom="true"
android:layout_below="#+id/tile_image"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:padding="5px"
android:layout_margin="8dp"
android:adjustViewBounds="false" />
<TextView
android:id="#+id/tile_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:maxLines="1"
android:text="Categorie"
android:layout_marginTop="10px"
android:layout_marginBottom="10px"
android:gravity="start"
android:textColor="#color/purple"
android:textSize="20sp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:padding="5px"
android:layout_alignParentBottom="true"
android:layout_marginLeft="10px" />
</RelativeLayout>
I literally have no idea how to implement the '3D effect' and if it is even possible.
I tried it with adding an image to the layout file. But that didn't work out for me, I couldn't get it right. It also felt like it wasn't the right way to do it.
Can someone help me?

I fixed it using 9-patch files. Using this online Nine-patch generator.

Android custom row layout issue

Sorry in advance I need to include a few pictures to make my problem a little easier to understand. I am using a linear layout for my custom rows and it is giving me lots of trouble trying to get the rows to look how I want. Currently it looks like this
Please forgive the quick paint picture I am about to show but it is how I would like the layout to look.
I would like to add the name textbox above the dog picture, and a time stamp textbox above each of the 1 and 2. Whenever I try to add textboxes to display this it really messes with the layout. The textbox above the dog picture always wants to go to the right or left of the dog image and push the image to the middle of the page and the buttons get spread out further. I do not have much experience with this layout I typically do relative layout where I can drag and drop pieces. Any advise or help is greatly appreciated.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton
android:layout_width="150dip"
android:layout_height="150dip"
android:id="#+id/dogimage"
android:clickable="true"
android:layout_alignParentLeft="true"
android:background="#drawable/dogpic"
android:onClick="sendProfile"
android:scaleType="fitXY" />
<ImageButton
android:layout_width="75dip"
android:layout_height="75dip"
android:id="#+id/dog1num1"
android:background="#drawable/num1"
android:clickable="true"
android:onClick="NumberOne"
android:layout_marginLeft="10dp"
android:layout_marginTop="75dp"
android:scaleType="fitXY" />
<ImageButton
android:layout_width="75dip"
android:layout_height="75dip"
android:id="#+id/dog1num2"
android:background="#drawable/num2"
android:clickable="true"
android:onClick="NumberTwo"
android:layout_marginLeft="10dp"
android:layout_marginTop="75dp"
android:scaleType="fitXY" />
</LinearLayout>

You need to wrap your imageview/textview combo in a LinearLayout. And you should set the imageButton using src, not background. Do it 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">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Title" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageButton
android:id="#+id/dogimage"
android:layout_width="150dip"
android:layout_height="150dip"
android:clickable="true"
android:onClick="sendProfile"
android:scaleType="fitXY"
android:src="#drawable/dogpic" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Timestamp 1" />
<ImageButton
android:id="#+id/dog1num1"
android:layout_width="75dip"
android:layout_height="75dip"
android:layout_marginLeft="10dp"
android:clickable="true"
android:onClick="NumberOne"
android:scaleType="fitXY"
android:src="#drawable/num1" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Timestamp 1" />
<ImageButton
android:id="#+id/dog1num2"
android:layout_width="75dip"
android:layout_height="75dip"
android:layout_marginLeft="10dp"
android:clickable="true"
android:onClick="NumberOne"
android:scaleType="fitXY"
android:src="#drawable/num2" />
</LinearLayout>
</LinearLayout>
</LinearLayout>

Android textview rotate with background

I need to create a layout something similar to below picture. My problem is how can I rotate text view and add a background to it. Tried custom textview with draw rotated. But cant position correctly with that method
<Button
android:id="#+id/dealItemPerc"
android:layout_width="150dp"
android:layout_height="20dp"
android:layout_alignParentLeft="true"
android:fontFamily="sans-serif-light"
android:background="#drawable/deal_percentage_back"
android:rotation="-45"
android:text="TextView"
android:textColor="#color/app_black"
android:textSize="14sp" />
Tried with a button but that also not worked because cant position correctly.

Created like this. rotated frame layout with text view inside of it. Don't know why the heck someone gave minus rate.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<me.dushyantha.mywebserviceapp.SquareImageView
android:id="#+id/dealItemImage"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:padding="5dp"
android:scaleType="fitXY"
android:src="#drawable/detail_rounded_block" >
</me.dushyantha.mywebserviceapp.SquareImageView>
<FrameLayout
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:rotation="-45"
>
<TextView
android:id="#+id/dealItemPerc"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="TextView"
android:textSize="14sp"
android:textColor="#color/white"
android:background="#drawable/deal_percentage_back"
/>
</FrameLayout>
</RelativeLayout>

activity_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.test1.MainActivity" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="25dip"
android:background="#android:color/black"
android:padding="5dip"
android:rotation="-45"
android:text="Hello World"
android:textColor="#android:color/white" />
</RelativeLayout>
Nothing to do with java code
Build and run the project.
Done

Android: fill relative layout height (item layout) inside ListView

I'm not able to make a View that fill the height of a RelativeLayout, which is the layout of ListView items. Here is my layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:background="#color/red"/>
<TextView
android:id="#+id/delivery_list_item_dest"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/fill_the_height_please"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="2dp"
android:text="Destinatario" />
<TextView
android:id="#+id/delivery_list_item_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/delivery_list_item_dest"
android:layout_below="#id/delivery_list_item_dest"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:text="Location" />
<ImageButton
android:id="#+id/delivery_list_item_mapBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="0dp"
android:src="#drawable/map_location"
android:background="#null" />
View with id fill_the_height_please not fill the item height. In figure below you can see the result (nothing is shown):
I'd like something like this:
ù
I have also try to change view layout as follows but not works anyway:
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
android:background="#color/red"/>
Please can you help to achieve my goal? Thank you.

One suggestion would be add layout_alignTop="#+id/delivery_list_item_mapBtn" and layout_alignBottom="#+id/delivery_list_item_mapBtn" to the View and make it always fit the image height.

Try changing
android:layout_toRightOf="#id/delivery_list_item_statusBtn"
to
android:layout_toRightOf="#id/fill_the_height_please"
You don't have delivery_list_item_statusBtn. But i see red part even without changing this. Try it and if it doesn't help please post code of your adapter.

Looking here it seems RelativeLayout has a bug in version 17 and lower. So i have change my layout as follows:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<View
android:id="#+id/fill_the_height_please"
android:layout_width="15dp"
android:layout_height="match_parent"
android:background="#color/red"/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
<TextView
android:id="#+id/delivery_list_item_dest"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Destinatario"
android:layout_marginBottom="5dp" />
<TextView
android:id="#+id/delivery_list_item_address"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Location" />
</LinearLayout>
<ImageButton
android:id="#+id/delivery_list_item_mapBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="0dp"
android:src="#drawable/map_location"
android:background="#null" />
</RelativeLayout>
A little bit more complex but works. However i leave the question unresolved in case someone find a solution using only a RelativeLayout