Develop Reference

Drawable with arrow indicator at top right corner?

can anyone please guide me
How i can make a drawable file to have a view like this image?
I have the border drawable here but not able to figure out on how can i draw arrow indicator over there
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/white" />
<stroke
android:width="#dimen/size_1"
android:color="#color/white_four" />
<corners android:radius="#dimen/layout_margin_3dp" />
</shape>
</item>
</layer-list>
Layout:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/border_drawbale_with_arrow_indicator"
android:orientation="vertical">
<TextView/>
<Separator/>
<TextView/>
</LinearLayout>

Edittext as spinner

I have a editext which I would like to show as drop down. SO for that I have background.xml file:
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item>
<shape>
<solid android:color="#ffffff" />
<stroke android:width="1dp" android:color="#000000" />
<padding android:bottom="3dp" android:left="3dp" android:right="3dp" android:top="3dp" />
</shape>
</item>
<item>
<bitmap android:gravity="right" android:src="#drawable/ic_arrow_drop_down" />
</item>
</layer-list>
</item>
</selector>
And added that as background for my edittext. This is what I get:
As you can see there is slight gap between the image and editext border. I would like to make my edittext like this:
How can I achieve this?

Try 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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bg"
android:orientation="horizontal">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#android:color/transparent" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:background="#drawable/bgnew"
android:src="#drawable/ic_android_black_24dp" />
</LinearLayout>
</LinearLayout>
Create bg.xml like this
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Background Color -->
<solid android:color="#ffffff" />
<!-- Border Color -->
<stroke android:width="1dp" android:color="#ff9900" />
</shape>
create a bgnew.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Background Color -->
<solid android:color="#ffffff" />
<!-- Border Color -->
<stroke android:width="1dp" android:color="#color/colorAccent" />
</shape>
Output

Create a RelativeLayout with EditText and ImageView UI Components :).
Don't complicate yourself.

Just try Linear layout with layout orientation horizontal of EditText and ImageView. It is simple.

Create shadow like this in android side drawer

How to create like this shadow in android side drawer?
Please help.

I am adding new layout as above how to add

1. Create a custom drawable for shadow e.g shadow_right.xml
shadow_right.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:bottom="2dp"
android:left="0dp"
android:right="0dp"
android:top="0dp">
<shape android:shape="rectangle">
<corners android:radius="0dp" />
<!-- change angle value below and see the effect-->
<gradient
android:angle="0"
android:centerColor="#14000000"
android:endColor="#44000000"
android:gradientRadius="2" />
</shape>
</item>
</layer-list>
2. Add drawable i.e. shadow_right as a background
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white">
<View
android:id="#+id/viewRight"
android:layout_width="10dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_marginTop="0dp"
android:background="#drawable/shadow_right"
android:visibility="visible" />
</RelativeLayout>
3. Replace the color values in shadow_right.xml

How to float/stick android button (containing image) totally left or right

I try to make a design for my application. I order to attract user's attention I tried to imagine something interesting.
My plan is obtaining a design like below:
Visual elements:
red areas are buttons
thin circles are images i will out later...
My goals:
On creation of the activity, buttons will com into screen, from out
bounds of the screen. (they can come one by one in an order, because
I do not want to get crazy with asynctasks, handlers and etc. )
2 corners of each button will be rounded smoothly
The Important and last one: when I click on a button, I want it to
hide out of the screen with reverse action as it came to screen.
At the first second I have faced with a problem already. Here it is:
As you see there is some space between button and layout.
Current xml layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="22dp"
android:text="Button" />
</RelativeLayout>
How can I solve this problem?
And I will be very happy to here suggestions about how to achieve my suggestions.

Ok, try that:
drawable/corners.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="rectangle">
<corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
<solid android:color="#888888" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="rectangle">
<corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
<solid android:color="#888888" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
<solid android:color="#BBBBBB" />
</shape>
</item>
</selector>
with that:
layout/button.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginTop="22dp"
android:background="#drawable/corners"
android:text="Button" />
</RelativeLayout>
Here is the version with text and picture:
drawable/corner.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
<solid android:color="#BBBBBB"/>
</shape>
</item>
</selector>
drawable/corner_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<corners android:topRightRadius="10dp" android:bottomRightRadius="10dp" />
<solid android:color="#888888"/>
</shape>
</item>
</selector>
drawable/states.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/corner_pressed" />
<item android:drawable="#drawable/corner" />
</selector>
and the main layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="22dp"
android:background="#drawable/states"
android:clickable="true">
<TextView
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="Button"
/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_launcher"
android:layout_toRightOf="#id/button1"
/>
</RelativeLayout>
</RelativeLayout>

How do I style selected item in Android ListView?

I am an Android newbie trying to learn the UI side of things and it's doing my head in. Here's what I have right now:
breeds_listing.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content">
<ListView android:id="#+id/breedsListView"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:dividerHeight="0px" android:divider="#00000000"></ListView>
</LinearLayout>
breeds_listing_item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:background="#drawable/list_item_background"
android:orientation="horizontal" >
<TextView android:id="#+id/allbreeds_single_item"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:gravity="center_horizontal"></TextView>
</LinearLayout>
list_item_background.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#043402" />
<stroke android:width="3dp" color="#ffff8080" />
<corners android:radius="8dp" />
<padding android:left="10dp" android:top="10dp" android:right="10dp"
android:bottom="10dp" />
</shape>
What I am struggling to figure out is how do I style the selected item? At the moment the selected item has a ghastly orange background which, under the rounded green rectangle, gives an orange outline effect. I'm sure I have not done things in line with best practices so any suggestions or improvements would be greatly appreciated.
Many thanks,
D.

I do this :
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape >
<solid android:color="#929292" />
</shape>
</item>
<item>
<shape >
<solid android:color="#FFFFFF" />
</shape>
</item>
</selector>
So you can use this property android:state_pressed="true"
In my example, the cell background will only be white, and grey when pressed.
I hope it helps!

You have to use a StateListDrawable.
You can find an example for ListView items here.
If you want a certain color/drawable when the item is selected, use android:state_focused="true".