Jak ustawić promień zaokrąglenia narożnika koloru, który można narysować za pomocą XML?

108

Na stronie Androida znajduje się sekcja dotycząca rysunków w kolorze . Definiowanie tych drawables w XML wygląda następująco:

<resources>
    <drawable name="solid_red">#f00</drawable>
    <drawable name="solid_blue">#0000ff</drawable>
    <drawable name="solid_green">#f0f0</drawable>
</resources>

W api Java mają one następującą metodę definiowania zaokrąglonych rogów:

setCornerRadius(float radius)

Czy istnieje sposób na ustawienie zaokrąglonych rogów w pliku XML?

android drawable Jay Askren
źródło
Aby ustawić rogi z kodu, zobacz (Gradient Drawables): stackoverflow.com/questions/8709595/ ...
samis

Odpowiedzi:

319

Użyj <shape>tagu, aby utworzyć rysowany w XML z zaokrąglonymi rogami. (Możesz zrobić inne rzeczy ze znacznikiem kształtu, na przykład zdefiniować gradient koloru).

Oto kopia pliku XML, którego używam w jednej z moich aplikacji do tworzenia rysunków z białym tłem, czarną ramką i zaokrąglonymi rogami:

<?xml version="1.0" encoding="UTF-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="#ffffffff"/>    
             
    <stroke android:width="3dp"
            android:color="#ff000000" />

    <padding android:left="1dp"
             android:top="1dp"
             android:right="1dp"
             android:bottom="1dp" /> 
             
    <corners android:radius="7dp" /> 
</shape>
Mark B.
źródło
1
gdzie zapisać ten plik i jak go zdobyć w moim kodzie java? dzięki
shyam
7
zapisz go jako plik xml w katalogu do rysowania, a następnie użyj go tak, jakbyś używał dowolnego elementu do rysowania (ikony lub pliku zasobów), używając jego nazwy zasobu (R.drawable.your_xml_name)
Guillaume
30
w tym konkretnym przypadku wszystkie promienie są takie same, więc można było użyć androida: radius = "7dp"
Will Kru
2
Ponadto moduł renderujący układ w Android Studio nie będzie w stanie go wyrenderować, jeśli oddzielnie zdefiniujesz promień (nawet przy tych samych wartościach) i wyświetli ostrzeżenie „Pat.isConvex nie jest obsługiwany”. Po prostu użyj <corners android: radius = "7dp" />
Francesco Ambrosini
@shyam Możesz ustawić go jako „tło”. Jeśli użyjesz go w TextView, musisz pamiętać o dodaniu dopełnienia na początku i na końcu, aby tekst nie był zatłoczony zaokrągloną krawędzią
RowanPD
19

Odpowiedź mbairda działa dobrze. Miej tylko świadomość, że wydaje się, że jest błąd w Androidzie (przynajmniej 2.1), że jeśli ustawisz promień dowolnego pojedynczego narożnika na 0, wymusi to wszystkie rogi na 0 (przynajmniej tak jest w przypadku jednostek "dp"; ja nie nie próbuj tego z innymi jednostkami).

Potrzebowałem kształtu, w którym górne rogi były zaokrąglone, a dolne - kwadratowe. Osiągnąłem to, ustawiając rogi, które chciałem, być kwadratowe, na wartość nieco większą niż 0: 0,1 dp. To nadal renderuje się jako kwadratowe rogi, ale nie wymusza na innych rogach promienia 0.

John Pisello
źródło
czy właśnie napisałeś 0.1 dp? czy to działa, potrzebuję też górnych zaokrąglonych rogów i dolnych kwadratowych, ten sam problem co ty właśnie użyłem 1 dp, na kwadratowych rogach i 10 dp na okrągłych, masz rację, nadal jest zauważalny, ale daje mi 90% tego, co ja chcesz, zgodnie z dokumentacją ustawienie 0 na nieokrągłych rogach powinno zadziałać.
codeScriber
Właściwie to nie jest błąd, jest w dokumentacji: developer.android.com/guide/topics/resources/ ...
Tsuharesu
1

Wypróbuj poniższy kod 

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners
    android:bottomLeftRadius="30dp"
    android:bottomRightRadius="30dp"
    android:topLeftRadius="30dp"
    android:topRightRadius="30dp" />
<solid android:color="#1271BB" />

<stroke
    android:width="5dp"
    android:color="#1271BB" />

<padding
    android:bottom="1dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp" /></shape>
Mujahid Khan
źródło