Edycja tekstu z rogiem i cień

Question

staram się osiągnąć efekt, który jest pokazany w tym poniższym obrazie:

W tym obrazie jest EditText z okrągłym rogu i cienia wewnętrznego na górze. Próbowałem dużo, ale nie udało mi się uzyskać cienia w edytorze tekstu.

Szukałem na ten temat, ale wszystkie przykłady pokazują cień poza granicami edittext. Nie mam pojęcia, jak mogę to osiągnąć.

Przycisk i obraz tła jest już zrobione, Pozostaje tylko cień edittext. Jeśli ktoś już to zrobił lub wie, jak to zrobić, podziel się ze mną. Należy docenić każdą pomoc.

Answer 1

miejsce poniżej style.xml do swojej rozciągliwej folderze

style.xml

<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android"> 

<item android:state_pressed="true" android:state_focused="true"> 
    <shape> 
     <stroke 
      android:width="2.3dp" 
      android:color="#F6EBC9" /> 
     <corners 
      android:radius="10dp" /> 
    </shape> 
</item> 

<item android:state_pressed="true" android:state_focused="false"> 
    <shape> 
     <stroke 
      android:width="2.3dp" 
      android:color="#F6EBC9" />  
     <corners 
      android:radius="10dp" />  
    </shape> 
</item> 

<item android:state_pressed="false" android:state_focused="true"> 
    <shape> 
     <stroke 
      android:width="0.7dp" 
      android:color="#000000" /> 
     <corners 
      android:radius="15dp" />       
    </shape> 
</item> 

<item android:state_pressed="false" android:state_focused="false"> 
    <shape> 
     <gradient 
      android:startColor="#F6EBC9" 
      android:centerColor="#F6EBC9" 
      android:endColor="#F6EBC9" 
      android:angle="270" 
     /> 
     <stroke 
      android:width="0.7dp"     
      android:color="#000000" /> 
     <corners 
      android:radius="15dp" />    
    </shape> 
</item> 

<item android:state_enabled="true"> 
    <shape> 
     <padding 
       android:left="4dp" 
       android:top="4dp" 
       android:right="4dp" 
       android:bottom="4dp" 
      /> 
    </shape> 
</item> 

</selector> 

i w pliku xml wewnątrz EditText tagu zastosować tę Android: t = "@ rozciągliwej/stylu" dostosuj kolor: startcolor, endcolor i środkowy wewnątrz tagu gradientu, instyle.xml, aby efekt cienia w edytowanym tekście można było ustawić jako tło dla przeciągania kształtu (prostokąta)

Answer 2

dla widoku.

<TextView android:text="Some text" android:background="@drawable/back"/> 

A prostokąt odkształcalne back.xml (oddany do Res/folderu rozciągliwej):

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > 
    <solid android:color="#ffffff" /> 
    <stroke android:width="1dip" android:color="#4fa5d5"/> 
</shape> 

Można użyć # 00000000 w jednolitym kolorze mieć przezroczyste tło. Możesz także użyć wypełnienia, aby oddzielić tekst od ramki. uzyskać więcej informacji, zobacz: http://developer.android.com/guide/topics/resources/drawable-resource.html

Answer 3

Wystarczy utworzyć plik xml w swojej rozciągliwej nazwy folderu jako round_corner.xml .A dodaj następujący kod.

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" > 

    <corners 
     android:radius="3dp" 
     /> 
    <solid 
     android:color="@android:color/white"/> 

</shape> 

At Last dodaniu tego xml w tle własność swojego EditText w następujący sposób: -

<EditText 
    android:id="@+id/ed1" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:background="@drawable/round_corner" 
    /> 

Done..Definitely to działa ..

Answer 4

1.) Utwórz rounded_edittext.xml plik w folderze do rysowania

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle" android:padding="15dp"> 
<solid android:color="#FFFFFF"/> 

    <corners 
    android:bottomRightRadius="5dp" 
    android:bottomLeftRadius="5dp" 
    android:topLeftRadius="5dp" 
    android:topRightRadius="5dp"/> 

    <stroke android:width="1dip" android:color="#FF0000" /> 
</shape> 

2.) Umieść poniższy kod w pliku styles.xml umieszczone w folderze wartości

<style name="largeEdittextText"> 
    <item name="android:textAppearance">@android:style/TextAppearance.Large.Inverse</item> 
    <item name="android:textSize">15dp</item> 
    <item name="android:singleLine">true</item> 
    <item name="android:paddingTop">8dp</item> 
    <item name="android:paddingBottom">8dp</item> 
    <item name="android:paddingLeft">5dp</item> 
    <item name="android:background">#FFB90F</item> 
    <item name="android:textColor">@android:color/black</item> 
</style> 

3.) Stosuje się zarówno na EditText w pliku layoutu

<EditText 
android:id="@+id/userName" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:layout_alignParentLeft="true" 
android:layout_alignParentTop="true" 
android:gravity="center_horizontal" 
android:hint="@string/login_userHint" 
android:text="admin" 
android:paddingTop="8dp" 
android:paddingBottom="8dp" 
android:singleLine="true" 
android:textAppearance="@style/largeEdittextText" 
android:background="@drawable/rounded_edittext"> 
</EditText> 

Answer 5

jeśli chcesz dokonać granicę z EditText rundy i łuku, a potem po prostu wklej ten kod w rozciągliwej/mystyle.xml (utwórz ten plik XML).

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:thickness="0dp" 
    android:shape="rectangle"> 
    <stroke android:width="1dp" 
    android:color="#c8c8c8"/> 
    <corners android:radius="11dp" /> 
</shape> 

Teraz w linku EditText ten plik jako

android:background="@+drawable/mystyle" 

Answer 6

Got jak ten

<?xml version="1.0" encoding="utf-8"?> 
<shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android"> 
     <gradient 
      android:centerY="0.2" 
      android:startColor="#FFBDBDBD" 
      android:centerColor="#65FFFFFF" 
      android:endColor="#00FFFFFF" 
      android:angle="270" 
      /> 
     <stroke 
      android:width="1dp" 
      android:color="#C3C3C3" /> 
     <corners 
      android:radius="25dp" /> 
</shape>