Ich möchte nur den oberen Rand einer Kartenansicht abrunden.
Ich habe das folgende Grundstück verwendet und es rundet die ganze Ecke ab.
Ich möchte eine Überlappung aller Karten anzeigen
card_view:cardCornerRadius="4dp"
hier ist mein Layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/card_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
card_view:cardCornerRadius="4dp"
card_view:cardPreventCornerOverlap="false"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="@+id/re1">
<TextView
android:id="@+id/title"
android:layout_width="match_parent"
android:layout_height="20dp"
android:background="@color/colorAccent"
android:text="contact det"
android:gravity="center_vertical"
android:textColor="@android:color/white"
android:textSize="14dp"/>
<TextView
android:id="@+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Name"
android:gravity="center_vertical"
android:textSize="10dp"
android:layout_below="@id/title"
android:layout_marginTop="10dp"
android:layout_marginLeft="5dp"/>
<TextView
android:id="@+id/txtSurname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Surname"
android:gravity="center_vertical"
android:textSize="10dp"
android:layout_below="@id/txtName"
android:layout_marginTop="10dp"
android:layout_marginLeft="5dp"
/>
<TextView
android:id="@+id/txtEmail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email"
android:textSize="10dp"
android:layout_marginTop="10dp"
android:layout_alignParentRight="true"
android:layout_marginRight="150dp"
android:layout_alignBaseline="@id/txtName"/>
<TextView
android:id="@+id/txtAdd"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Address"
android:textSize="10dp"
android:layout_alignLeft="@id/txtEmail"
android:layout_alignBaseline="@id/txtSurname"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
Wir können den marginBottom der Kartenansicht auf einen negativen Wert setzen. Der Rand sollte den gleichen Wert wie der Kartenradius haben. Zum Beispiel,
<FrameLayout
android:id="@+id/rootview"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.CardView
android:id="@+id/card_view"
android:layout_marginBottom="-3dp"
project:cardCornerRadius="3dp"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--The child view inside the cardview should have extra padding,so that negative margin will not affect the bottom padding of its child.Here normally we have 16dp bottom padding for child + margin bottom of the parent is 3dp=19dp comes.-->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="19dp"/>
</android.support.v7.widget.CardView>
</FrameLayout>
Es funktioniert für mich. Aber ich bin im Zweifel, ob es der richtige Weg ist. Alle Vorschläge sind willkommen.
Ankit Deshmukh
Ich habe dasselbe versucht, aber keine der bereitgestellten Lösungen hat bei mir funktioniert.
Das einzige was funktionierte war:
1) Erstellen Sie eine benutzerdefinierte Hintergrundressource (z. B. eine rechteckige Form) mit abgerundeten Ecken.
2) Legen Sie diesen benutzerdefinierten Hintergrund mit dem Befehl fest –
cardView = view.findViewById(R.id.card_view2);
cardView.setBackgroundResource(R.drawable.card_view_bg);
Hat bei mir perfekt funktioniert! Hoffe das hilft dir.
Das XML-Layout, das ich mit Radius oben links und unten rechts erstellt habe.
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@color/white" />
<corners android:topLeftRadius="18dp" android:bottomRightRadius="18dp" />
</shape>
In Ihrem Fall müssen Sie nur topLeftRadius sowie topRightRadius ändern.
Oder Sie können verwenden MaterialCardView
<com.google.android.material.card.MaterialCardView
style="@style/CustomCardViewStyle"
...>
</com.google.android.material.card.MaterialCardView>
<style name="CustomCardViewStyle" parent="@style/Widget.MaterialComponents.CardView">
<item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay_card_custom_corners</item>
</style>
<style name="ShapeAppearanceOverlay_card_custom_corners" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">4dp</item>
<item name="cornerSizeTopLeft">8dp</item>
<item name="cornerSizeBottomRight">16dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Hier finden Sie eine gute Antwort
EpicPandaForce
Schwierige Sache, weil Sie CardView nicht dazu bringen können, dies zu tun. Intern verwendet es a RoundRectDrawable
(Paket privat) was verwendet roundRect
so was:
// rectf, rx, ry, paint
canvas.drawRoundRect(mBoundsF, mRadius, mRadius, paint);
Daher benötigen Sie eine andere Lösung, die ich zum Beispiel gefunden habe diesen Kern von Ahmed-Abdelmeged wo sie Leinwandausschnitte für jede Ecke verwenden, indem sie einen Pfad verwenden, um den Umriss zu beschreiben.
Obwohl ich nicht derjenige bin, der diesen Code erstellt hat, werde ich ihn hier für zukünftige Reisende veröffentlichen.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="RoundedView">
<attr name="topLeftCornerRadius" format="dimension" />
<attr name="topRightCornerRadius" format="dimension" />
<attr name="bottomLeftCornerRadius" format="dimension" />
<attr name="bottomRightCornerRadius" format="dimension" />
</declare-styleable>
</resources>
und
package com.abdelmeged.ahmed.roundedlayout;
/**
* Created by ahmed on 9/17/2017.
*/
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Path;
import android.graphics.RectF;
import android.graphics.Region;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.FrameLayout;
/**
* Custom wrapper view to get round corner round view
*/
public class RoundedView extends FrameLayout {
/**
* The corners than can be changed
*/
private float topLeftCornerRadius;
private float topRightCornerRadius;
private float bottomLeftCornerRadius;
private float bottomRightCornerRadius;
public RoundedView(@NonNull Context context) {
super(context);
init(context, null, 0);
}
public RoundedView(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init(context, attrs, 0);
}
public RoundedView(@NonNull Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs, defStyleAttr);
}
private void init(Context context, AttributeSet attrs, int defStyle) {
TypedArray typedArray = context.obtainStyledAttributes(attrs,
R.styleable.RoundedView, 0, 0);
//get the default value form the attrs
topLeftCornerRadius = typedArray.getDimension(R.styleable.
RoundedView_topLeftCornerRadius, 0);
topRightCornerRadius = typedArray.getDimension(R.styleable.
RoundedView_topRightCornerRadius, 0);
bottomLeftCornerRadius = typedArray.getDimension(R.styleable.
RoundedView_bottomLeftCornerRadius, 0);
bottomRightCornerRadius = typedArray.getDimension(R.styleable.
RoundedView_bottomRightCornerRadius, 0);
typedArray.recycle();
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}
@Override
protected void dispatchDraw(Canvas canvas) {
int count = canvas.save();
final Path path = new Path();
float[] cornerDimensions = {
topLeftCornerRadius, topLeftCornerRadius,
topRightCornerRadius, topRightCornerRadius,
bottomRightCornerRadius, bottomRightCornerRadius,
bottomLeftCornerRadius, bottomLeftCornerRadius};
path.addRoundRect(new RectF(0, 0, canvas.getWidth(), canvas.getHeight())
, cornerDimensions, Path.Direction.CW);
canvas.clipPath(path);
super.dispatchDraw(canvas);
canvas.restoreToCount(count);
}
public void setTopLeftCornerRadius(float topLeftCornerRadius) {
this.topLeftCornerRadius = topLeftCornerRadius;
invalidate();
}
public void setTopRightCornerRadius(float topRightCornerRadius) {
this.topRightCornerRadius = topRightCornerRadius;
invalidate();
}
public void setBottomLeftCornerRadius(float bottomLeftCornerRadius) {
this.bottomLeftCornerRadius = bottomLeftCornerRadius;
invalidate();
}
public void setBottomRightCornerRadius(float bottomRightCornerRadius) {
this.bottomRightCornerRadius = bottomRightCornerRadius;
invalidate();
}
}
Dadurch können Sie den Rand von Bildern und Ansichten beschneiden, bevor sie gerendert werden, daher macht es genau das, was Sie wollen.
Anoop M Maddasseri
Wenn Sie nur ein Bild formen möchten, verwenden Sie Material ShapeableImageView
die die Bitmap mit dem bereitgestellten Shape zeichnet.
<!-- Media -->
<com.google.android.material.imageview.ShapeableImageView
...
app:shapeAppearance="?attr/shapeAppearanceMediumComponent"
app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlay.App.Card.Media" />
Im res/values/styles.xml
:
<style name="ShapeAppearanceOverlay.App.Card.Media" parent="">
<item name="cornerSizeBottomLeft">0dp</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeTopLeft">8dp</item>
<item name="cornerSizeTopRight">8dp</item>
</style>
hek
Nun, ich bin so verzweifelt, einen Weg zu finden, dies zu erreichen, eines ist nicht möglich, und das Erstellen eines eigenen Schattens ist etwas, das mir das Ergebnis nicht gefällt, und in meinem Fall habe ich das Glück, dass ich es in der Ecke des Bildschirms oben rechts brauche genau sein.
Machen wir es einfach, machen Sie eine übergroße Kartenansicht in eine andere Ansicht. In meinem Fall verwende ich das Rahmenlayout und ändere dann die x- und y-Übersetzung auf das, was Sie brauchen. Nun, ich mache die Übersetzung x und y in denselben genauen Kartenradius-Eckenwert. und los geht’s mit einseitig gerundeter Kartenansicht auf barbarische Art und Weise.
Code ? Probe ? Bitte schön
<FrameLayout
android:id="@+id/miniTimer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="@+id/frameLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<androidx.cardview.widget.CardView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:translationX="10dp"
android:translationY="-10dp"
app:cardBackgroundColor="@android:color/transparent"
app:cardCornerRadius="10dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/drwable_red__rounded_botleft_10"
android:gravity="center"
android:orientation="horizontal"
android:paddingStart="5dp"
android:paddingLeft="5dp"
android:paddingTop="10dp"
android:paddingEnd="10dp"
android:paddingRight="10dp"
android:paddingBottom="5dp">
<TextView
android:id="@+id/miniTimerText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorAccent"
android:textSize="12dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</FrameLayout>
Hinweis: Oh, ich generiere den Textansichtstext dynamisch, also füge ihn selbst hinzu 🙂
Krushna Bade
Ich habe nur eine Kartenansicht erstellt, um das Bild für den Eckenradius zu umschließen, und dann das Beschränkungslayout verwendet, um eine Führungslinie hinzuzufügen, und das Textlayout unten zur Führungslinie hinzugefügt. dann haben sich Hilfslinien auf Karte mit Rand überschnitten.
<androidx.constraintlayout.widget.ConstraintLayout xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/card_icon"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/_10sdp"
android:layout_marginRight="@dimen/_10sdp"
android:layout_marginTop="@dimen/_9sdp"
android:elevation="@dimen/_2sdp"
android:background="@drawable/card_top_corners"
android:clipChildren="true"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="@dimen/_152sdp"
app:cardCornerRadius="@dimen/_10sdp"
app:cardPreventCornerOverlap="false"
app:cardElevation="0dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="@+id/imageView"
android:layout_width="match_parent"
android:layout_height="@dimen/_142sdp"
android:scaleType="centerCrop"
android:src="@drawable/shahruk"
android:visibility="visible" />
</androidx.cardview.widget.CardView>
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline14"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="@dimen/_142sdp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/guideline14">
<TextView
android:id="@+id/txt_title"
style="@style/medium_14sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="start"
android:paddingLeft="@dimen/_8sdp"
android:paddingTop="@dimen/_8sdp"
android:paddingRight="@dimen/_8sdp"
android:text="Rupa Singh: First indian woman to become a Jockey."
android:textColor="@color/city_news_text" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/_8sdp"
android:layout_marginRight="@dimen/_8sdp"
android:orientation="horizontal">
<TextView
android:id="@+id/txt_date"
style="@style/medium_9sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:maxWidth="@dimen/_120sdp"
android:maxLines="1"
android:paddingTop="2dp"
android:text="Today"
android:textColor="@color/header_new"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<View
android:id="@+id/view2"
android:layout_width="1dp"
android:layout_height="@dimen/_8sdp"
android:layout_gravity="center"
android:layout_marginLeft="@dimen/_7sdp"
android:layout_marginRight="@dimen/_7sdp"
android:background="@color/header_new"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@+id/txt_date"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_special_tag"
style="@style/medium_9sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="start|center_vertical"
android:maxLines="1"
android:paddingTop="2dp"
android:text="Top News"
android:textColor="@color/header_new"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/view2"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
<TextView
style="@style/regular_11sp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/_5sdp"
android:paddingLeft="@dimen/_8sdp"
android:paddingTop="@dimen/_2sdp"
android:paddingRight="@dimen/_8sdp"
android:paddingBottom="@dimen/_8sdp"
android:text="Napur records highest temperature in summers this year with measure of 225 degree celsius....[Read more]"
android:textColor="@color/scheme_subtext" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
Bitte überprüfen Sie das Ergebnis im Bild
128350 0 0 cookie-check Runden Sie nur die obere Ecke der Kartenansicht ab yes
Überprüfen Sie diese Antwort
– Gabriele Mariotti
12. Februar 2020 um 7:58 Uhr