Android coins arrondis arrondis XML
J'ai configuré un LinearLayout avec l'arrière-plan dessinable suivant:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android">
<corners Android:radius="10dp" />
<solid Android:color="#CCFFFFFF"/>
</shape>
Le problème que j'ai est dans le LinearLayout J'ai un autre élément LinearLayout qui se trouve au bas de son parent. Comme il n'y a pas de coins arrondis, ses coins dépassent les coins inférieurs gauche et droit des parents.
L'arrière-plan dessinable sur le Child LinearLayout ressemble à ceci:
<?xml version="1.0" encoding="utf-8"?>
<bitmap
xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:src="@drawable/pedometer_stats_background"
Android:tileMode="repeat"
/>
Le problème ressemble à ceci: http://kttns.org/hn2zm sur l'appareil le non-écrêtage est plus apparent.
Quelle est la meilleure méthode pour réaliser l'écrêtage?
À quoi ressemble votre description:
<LinearLayout Android:shape="rounded">
<LinearLayout Android:background="@drawable/pedometer_stats_background">
</LinearLayout>
</LinearLayout>
Et la disposition intérieure pousse à l'extérieur des coins arrondis car elle n'est pas arrondie. Vous devrez arrondir les coins de votre bitmap. Si vous avez un bitmap répétitif, vous voudrez peut-être envisager de définir un dessin à neuf patchs. Arrondissez vos coins puis définissez la partie du graphique qui peut se développer.
http://developer.Android.com/guide/topics/resources/drawable-resource.html#Shape
Ce serait bien si nous pouvions simplement ajouter une image bitmap à la forme dessinable et la faire appliquer comme peau sur la forme que nous dessinons. Et, je parie que si vous savez ce que vous faites, vous pouvez créer une sous-classe Shape qui dessine un bitmap, mais ce n'est pas inclus dans Android hors de la boîte malheureusement.
Mise à jour 2018
Beaucoup de choses ont changé au cours des 7 dernières années.
La meilleure façon de gérer ce type de mise en page ces jours-ci est d'utiliser CardView
qui prend également en charge les coins arrondis et de nombreuses autres fonctionnalités d'interface utilisateur plus récentes.
Appliquez la propriété cardCornerRadius
pour définir les coins à arrondir.
<Android.support.v7.widget.CardView
.......
app:cardCornerRadius="16dp">
</Android.support.v7.widget.CardView>
Original
J'avais besoin de dispositions arrondies de style iPhone, avec un fond gris derrière elles. (soupir - toujours copier l'iPhone)
J'étais frustré de ne pas pouvoir trouver un moyen de masquer une mise en page. La plupart des réponses ici disent d'utiliser une image d'arrière-plan, mais ce n'est pas ce dont j'avais besoin.
Modifier : La réponse précédente a suggéré d'utiliser un FrameLayout
et de définir le Android:foreground
dessinable. Cela a introduit un rembourrage étrange dans la vue. J'ai mis à jour ma réponse pour utiliser une technique RelativeLayout
plus simple.
L'astuce consiste à utiliser un RelativeLayout
; placez votre mise en page à l'intérieur. Sous votre mise en page, ajoutez un autre ImageView
, en définissant son background
sur un cadre d'image de masquage approprié. Cela dessinera cela au-dessus de votre autre mise en page.
Dans mon cas, j'ai fait un fichier 9Patch qui était un fond gris, avec un rectangle arrondi transparent découpé.
Cela crée le masque parfait pour votre mise en page sous-jacente.
Le code XML est ci-dessous - il s'agit d'un fichier XML de mise en page normale:
<RelativeLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_height="wrap_content" Android:layout_width="fill_parent">
<!-- this can be any layout that you want to mask -->
<LinearLayout Android:id="@+id/mainLayout"
Android:layout_height="wrap_content"
Android:layout_width="fill_parent" Android:orientation="vertical"
Android:background="@Android:color/white">
<TextView Android:layout_height="wrap_content"
Android:layout_width="wrap_content" Android:layout_gravity="center"
Android:text="Random text..." />
</LinearLayout>
<!-- FRAME TO MASK UNDERLYING VIEW -->
<ImageView Android:layout_height="fill_parent"
Android:layout_width="fill_parent"
Android:background="@drawable/grey_frame"
Android:layout_alignTop="@+id/mainLayout"
Android:layout_alignBottom="@+id/mainLayout" />
</RelativeLayout>
Notez le ImageView
en bas, aligné en haut et en bas sur la disposition principale, avec l'image de masquage définie:
Android:background="@drawable/grey_frame"
Cela fait référence à mon fichier 9Patch - et masque la disposition sous-jacente en étant dessiné au premier plan.
Voici un exemple montrant les coins arrondis gris sur une disposition standard.
hth
API niveau 21 (Lollipop) ajoutée View.setClipToOutline . De Android sur Définition des ombres et des vues de détourage :
Pour découper une vue sous la forme d'un dessin, définissez le dessin comme arrière-plan de la vue ... et appelez la méthode View.setClipToOutline ().
J'ai testé cela en définissant l'arrière-plan d'une vue parent sur GradientDrawable avec un rayon de coin, et les vues enfants sont correctement rognées pour correspondre aux mêmes coins arrondis du parent.