Change Size of EditText bottom border - android

I have some EditText in my code and I want to make the bottom border of it a bit thinner. Couldn't find anything about it in the Internet, maybe anyone here can help me with it.
What I have:
What I want:

Try like this for focus effects:
edt_bg_selector.xml :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/edt_bg_selected" android:state_focused="true"/>
<item android:drawable="#drawable/edt_bg_normal" android:state_focused="false"/>
</selector>
edt_bg_normal.xml :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:bottom="1dp"
android:left="-2dp"
android:right="-2dp"
android:top="-2dp">
<shape android:shape="rectangle" >
<stroke
android:width="1px"
android:color="#FF000000" />
<solid android:color="#00FFFFFF" />
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
</item>
</layer-list>
edt_bg_selected.xml :
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:bottom="1dp"
android:left="-2dp"
android:right="-2dp"
android:top="-2dp">
<shape android:shape="rectangle" >
<stroke
android:width="1px"
android:color="#ff0000" />
<solid android:color="#00FFFFFF" />
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
</item>
</layer-list>
and change your edit text like:
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/edt_bg_selector" />

Try like this below:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#null"
android:hint="Biografie"
android:textColorHint="#99000000"
android:drawableLeft="#drawable/quote_img" />
<View
android:layout_width="match_parent"
android:layout_height="1px"
android:background="#80000000" />
</LinearLayout>
Or
keep this btm_line_shape.xml in your drawable folder:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:bottom="1dp"
android:left="-2dp"
android:right="-2dp"
android:top="-2dp">
<shape android:shape="rectangle" >
<stroke
android:width="1px"
android:color="#FF000000" />
<solid android:color="#00FFFFFF" />
<padding
android:bottom="5dp"
android:left="5dp"
android:right="5dp"
android:top="5dp" />
</shape>
</item>
</layer-list>
and
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Biografie"
android:textColorHint="#99000000"
android:background="#drawable/btm_line_shape"
android:drawableLeft="#drawable/quote_image" />

Related

Add foreground within borders

I have a recylcerview with borders, and i want to add an animation to the bordered area only, how do i add it? I want to add android:foreground="?attr/selectableItemBackground" such that when row is clicked, only the bordered area displays the animation, not the whole row
Recycler View
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/recycler_view" />
</androidx.constraintlayout.widget.ConstraintLayout>
Row item
<?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="wrap_content"
android:id="#+id/pokedex_row"
android:padding="10sp"
android:clickable="true"
android:focusable="true"
android:background="#drawable/card_background"
android:elevation="12dp"
android:foreground="?attr/selectableItemBackground"
>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/pokedex_row_text_view"
android:layout_margin="10sp"
/>
</LinearLayout>
background of row
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:left="8dp"
android:right="3dp"
android:top="8dp"
android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="#CBAAAAAA"
android:width="1dp"/>
<corners android:radius="5dp" />
</shape>
</item>
<item
android:left="5dp"
android:right="5dp"
android:top="5dp"
android:bottom="5dp">
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
<corners android:radius="5dp" />
</shape>
</item>
</layer-list>
You could use the ripple tag instead of layer-list to acheive the required behaviour.
Note: This will work only for API 21+(Lollipop).
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:tools="http://schemas.android.com/tools"
xmlns:android="http://schemas.android.com/apk/res/android"
tools:targetApi="lollipop" android:color="?colorControlNormal">
<item
android:left="8dp"
android:right="3dp"
android:top="8dp"
android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="#CBAAAAAA"
android:width="1dp"/>
<corners android:radius="5dp" />
</shape>
</item>
<item
android:left="5dp"
android:right="5dp"
android:top="5dp"
android:bottom="5dp">
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
<corners android:radius="5dp" />
</shape>
</item>

Android Drawable Horizontal Line

Is it possible to make line to be like this with xml? or there's some way to do that..?
I already made some drawable with shape but it's not really like i want
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:bottomLeftRadius="30dp"
android:bottomRightRadius="30dp"
android:topLeftRadius="0dp"
android:topRightRadius="0dp" />
<padding
android:bottom="0dp"
android:left="0dp"
android:right="0dp"
android:top="0dp" />
<stroke
android:width="0.8dp"
android:color="#color/colorPrimaryDark" />
<solid android:color="#android:color/transparent" />
</shape>
We can create a drawable file also for this. May be helpful for someone.
Drawable file:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#android:color/white" />
</shape>
</item>
<item>
<shape android:shape="rectangle">
<stroke
android:width="5dp"
android:color="#android:color/holo_blue_dark" />
<solid android:color="#android:color/white" />
<corners android:radius="20dp" />
</shape>
</item>
<item android:bottom="25dp">
<shape android:shape="rectangle">
<stroke
android:width="2dp"
android:color="#android:color/white" />
<solid android:color="#android:color/white" />
</shape>
</item>
</layer-list>
Result :
<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
android:insetLeft="-5dp"
android:insetRight="-5dp"
android:insetTop="-10dp">
<shape android:shape="rectangle">
<solid android:color="#android:color/transparent" />
<stroke
android:width="3dp"
android:color="#color/colorPrimaryDark" />
<corners
android:bottomLeftRadius="25dp"
android:bottomRightRadius="25dp" />
</shape>
</inset>
Try this
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<stroke
android:width="1dp"
android:color="#de0b0b" />
<solid android:color="#ffffff" />
<corners android:radius="20dp" />
</shape>
</item>
<item
android:bottom="5dp"
android:top="0dp">
<shape android:shape="rectangle">
<stroke
android:width="10dp"
android:color="#ffffff" />
<solid android:color="#android:color/transparent" />
<corners android:radius="20dp" />
</shape>
</item>
</layer-list>
USE 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:gravity="center"
android:background="#ffffff"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/test"
android:text="Nilesh"
android:gravity="center"
android:layout_margin="#dimen/_5sdp"
android:padding="#dimen/_5sdp">
</TextView>
</LinearLayout>
OUTPUT
EDIT
Try this
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape
android:shape="rectangle">
<stroke android:width="1dp" android:color="#a032e4" />
<solid android:color="#a032e4" />
<corners android:radius="40dp"/>
</shape>
</item>
<item android:bottom="4dp" >
<shape
android:shape="rectangle">
<stroke android:width="2dp" android:color="#ffffff" />
<solid android:color="#ffffff" />
<corners android:radius="40dp"/>
</shape>
</item>
</layer-list>
USE 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:gravity="center"
android:background="#FFFFFF"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/test"
android:layout_margin="20dp"
android:padding="10dp"
android:text="Nilesh Rathod"
android:gravity="center" />
</LinearLayout>
OUTPUT

I'm trying to customize a seekbar, but it's not working

I have this image of the seekbar that I want to build:
But my seekbar is looking like this:
My seekbar has no transparency and I can not make it thinner.
How can I do this?
Here are the codes:
Seekbar:
<SeekBar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alpha="0.75"
android:max="25"
android:min="7"
android:progress="1"
android:splitTrack="false"
android:progressDrawable="#drawable/progress_seek_bar_settings"
android:thumb="#drawable/thumb_seekbar_settins" />
Thumb:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="oval">
<size
android:height="20dp"
android:width="20dp" />
<solid android:color="#color/color_primary_dark" />
</shape>
</item>
</layer-list>
Progress:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background">
<shape>
<gradient
android:startColor="#color/color_primary"
android:endColor="#color/color_primary"/>
<size
android:width="1dp"
android:height="2dp"
/>
<corners android:radius="3dp" />
</shape>
</item>
<item android:id="#android:id/progress">
<clip>
<shape>
<gradient
android:startColor="#color/color_primary"
android:endColor="#color/color_primary" />
<size
android:width="1dp"
android:height="2dp"
/>
<corners android:radius="3dp" />
</shape>
</clip>
</item>
</layer-list>
I need help getting it as close to the first image as possible. Thank you!!
Hello in drawable/progress_seek_bar_settings transform
<item android:id="#android:id/background">
in
<item android:id="#android:id/background"
android:height="3dp"
android:gravity="center_vertical"
>
UPDATE
drawable/thumb_seekbar_settins.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="oval">
<size
android:height="20dp"
android:width="20dp" />
<solid android:color="#ebeb" />
</shape>
</item>
</layer-list>
drawable/progress_seek_bar_settings.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background"
android:height="3dp"
android:gravity="center_vertical"
>
<shape>
<gradient
android:startColor="#ebeb"
android:endColor="#ebeb"/>
<size
android:width="1dp"
android:height="2dp"
/>
<corners android:radius="3dp" />
</shape>
</item>
<item android:id="#android:id/progress"
android:height="3dp"
android:gravity="center_vertical"
>
<clip>
<shape>
<gradient
android:startColor="#ebeb"
android:endColor="#ebeb" />
<size
android:width="1dp"
android:height="2dp"
/>
<corners android:radius="3dp" />
</shape>
</clip>
</item>
</layer-list>
activity
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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:paddingTop="40dp"
android:background="#android:color/black"
>
<SeekBar
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:alpha="0.75"
android:max="100"
android:min="7"
android:progress="1"
android:splitTrack="false"
android:progressDrawable="#drawable/progress_seek_bar_settings"
android:thumb="#drawable/thumb_seekbar_settins" />
</android.support.constraint.ConstraintLayout>
looks like this:

Android listviewItem border color on selected

I'm going to have a listview with some items, when I select a row in a listview, it should have a border. So how can I Achieve something like this.
I try this. but it works only when I press the row
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" ><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke android:width="4dp" android:color="#87CEFA" />
<solid android:width="1dp" android:color="#color/greylight" />
<padding android:bottom="4dp" android:left="3dp" android:right="3dp" android:top="6dp" />
<corners android:radius="5px" />
</shape></item>
<item><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:width="1dp" android:color="#color/greylight" />
<padding android:bottom="4dp" android:left="3dp" android:right="3dp" android:top="6dp" />
</shape></item>
</selector>
and here is My row
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/backColor"
android:orientation="horizontal" >
<RelativeLayout
android:id="#+id/relativeMain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="#drawable/list_item_selector" >
<TextView
android:id="#+id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:textColor="#color/RedColor"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
</LinearLayout>
Try to use android:state_focused state in one of your items in selector
<item android:state_focused="true" ><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:width="1dp" android:color="#color/greylight" />
<padding android:bottom="4dp" android:left="3dp" android:right="3dp" android:top="6dp" />
</shape></item>
try to use this code as border for your item in drawable folder :
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:padding="10dp"
android:shape="rectangle" >
<solid android:color="#android:color/transparent" />
<stroke
android:width="1px"
android:color="#61979797" />
<corners
android:bottomLeftRadius="1dp"
android:bottomRightRadius="1dp"
android:topLeftRadius="0dp"
android:topRightRadius="0dp" />
</shape>
and use this code also for selector in drawable folder :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/border" android:state_selected="true"></item>
<item android:drawable="#android:color/transparent"></item>
</selector>
You need to use state_selected="true" in your selector.
Here's a something similar that I am using in one of my projects:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true">
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<stroke android:width="1dp" android:color="#color/White"/>
</shape>
</item>
</selector>

listview border remove when focus

My listview remove his border when focus or long press this way
below is my listview code please help me why border remove when focus???
everything is fine only listview border will remove whenlong presss
i edit my code please check now
<LinearLayout
android:id="#+id/lytContent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/layout_border"
android:orientation="vertical" >
<ListView
android:id="#+id/listMainMenu2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:dividerHeight="1dip"
android:fadeScrollbars="true"
android:listSelector="#drawable/listview_selector" />
</LinearLayout>
<-----listview_selector.xml---->
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:drawable="#drawable/listviewborder"
android:state_focused="true"/>
<item
android:drawable="#drawable/listview_selector_pressed"
android:state_pressed="true"/>
</selector>
<-----listviewborder.xml----->
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle" >
<solid android:color="#000000" />
</shape>
</item>
<item
android:bottom="1dp"
android:left="1dp"
android:right="1dp"
android:top="1dp">
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:endColor="#56768d"
android:startColor="#0a89f1" />
</shape>
</item>
</layer-list>
<------listview_selector_pressed------>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="rectangle">
<solid android:color="#000000" />
</shape>
</item>
<item android:left="1dp" android:right="1dp" android:top="1dp" android:bottom="1dp"
>
<shape android:shape="rectangle">
<gradient
android:startColor="#0a89f1"
android:endColor="#56768d"
android:angle="90" />
</shape>
</item>
</layer-list>
<-----layoutborder.xml--->
<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#FFFFFF" />
<stroke
android:width="3dip"
android:color="#B1BCBE" />
<corners android:radius="10dip" />
<padding
android:bottom="0dip"
android:left="0dip"
android:right="0dip"
android:top="0dip" />
</shape>

Categories

Resources