如何在 Android 中显示卡片视图背景,如进度?
How to show card view background like progress in Android?
我想像这样设置 CardView
的 app:cardBackgroundColor
:
<-----x----->
|-----------|------|
| color1 |color2|
|-----------|------|
其中 x
是 CardView
中有 color1
的百分比,
默认情况下,整个背景颜色应为 color2
,
如何在代码中动态设置? (最好是Kotlin
)
好的,您将不得不做更多的研究、试验和错误;但是为了让你开始,我能想到的唯一可以做到这一点的方法是:
在运行时创建自定义渐变,从您定义的 "x" 中选取值。 (*)
创建一个覆盖 onDraw
的 class CustomCardView: CardView()
或您认为适合绘制背景的任何其他方法,还需要 "x" 值 (*)
结合这两种解决方案,让您的CustomCardView
在运行时构造一个渐变并将其设置为背景,使用上面 1 和 2 中的代码。
(*)
如果 "x" 是您希望人们在设计时通过 XML 更改的动态值,您将需要创建一个自定义属性并让您的 CustomCardView
pick/read 值如果存在。
我在评论区的意思是你可以喜欢这个;
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 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="150dp"
app:cardCornerRadius="16dp"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="150dp">
<LinearLayout
android:id="@+id/left_side"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_toStartOf="@+id/right_side"
android:layout_toLeftOf="@+id/right_side"
android:background="@color/colorPrimary"
android:orientation="vertical" />
<LinearLayout
android:id="@+id/right_side"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="@color/colorPrimaryDark"
android:orientation="vertical" />
</RelativeLayout>
</android.support.v7.widget.CardView>
您可以根据需要更改布局或卡片视图的宽度和高度。
希望这有帮助。
我认为最简单的方法是将 CardView
的内容放入 FrameLayout
,根据 docs:
Child views are drawn in a stack, with the most recently added child on top. The size of the FrameLayout is the size of its largest child (plus padding), visible or not (if the FrameLayout's parent permits). Views that are View.GONE are used for sizing only if setConsiderGoneChildrenWhenMeasuring() is set to true.
假设这是 CardView
布局:
<androidx.cardview.widget.CardView>
<!-- your contents -->
</androidx.cardview.widget.CardView>
改成:
<androidx.cardview.widget.CardView>
<FrameLayout>
<LinearLayout android:orientation="horizontal">
<View
android:id="@+id/left"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0"
android:background="color1"/>
<View
android:id="@+id/right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="100"
android:background="color2"/>
</LinearLayout>
<!-- your contents -->
</FrameLayout>
</androidx.cardview.widget.CardView>
并且在代码中:
findViewById<View>(R.id.left).layoutParams = LinearLayout.LayoutParams(
0, LinearLayout.LayoutParams.MATCH_PARENT, x)
findViewById<View>(R.id.right).layoutParams = LinearLayout.LayoutParams(
0, LinearLayout.LayoutParams.MATCH_PARENT, 100f - x)
我想像这样设置 CardView
的 app:cardBackgroundColor
:
<-----x----->
|-----------|------|
| color1 |color2|
|-----------|------|
其中 x
是 CardView
中有 color1
的百分比,
默认情况下,整个背景颜色应为 color2
,
如何在代码中动态设置? (最好是Kotlin
)
好的,您将不得不做更多的研究、试验和错误;但是为了让你开始,我能想到的唯一可以做到这一点的方法是:
在运行时创建自定义渐变,从您定义的 "x" 中选取值。 (*)
创建一个覆盖
onDraw
的class CustomCardView: CardView()
或您认为适合绘制背景的任何其他方法,还需要 "x" 值 (*)结合这两种解决方案,让您的
CustomCardView
在运行时构造一个渐变并将其设置为背景,使用上面 1 和 2 中的代码。
(*)
如果 "x" 是您希望人们在设计时通过 XML 更改的动态值,您将需要创建一个自定义属性并让您的 CustomCardView
pick/read 值如果存在。
我在评论区的意思是你可以喜欢这个;
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView 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="150dp"
app:cardCornerRadius="16dp"
tools:context=".MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="150dp">
<LinearLayout
android:id="@+id/left_side"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_toStartOf="@+id/right_side"
android:layout_toLeftOf="@+id/right_side"
android:background="@color/colorPrimary"
android:orientation="vertical" />
<LinearLayout
android:id="@+id/right_side"
android:layout_width="150dp"
android:layout_height="150dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:background="@color/colorPrimaryDark"
android:orientation="vertical" />
</RelativeLayout>
</android.support.v7.widget.CardView>
您可以根据需要更改布局或卡片视图的宽度和高度。 希望这有帮助。
我认为最简单的方法是将 CardView
的内容放入 FrameLayout
,根据 docs:
Child views are drawn in a stack, with the most recently added child on top. The size of the FrameLayout is the size of its largest child (plus padding), visible or not (if the FrameLayout's parent permits). Views that are View.GONE are used for sizing only if setConsiderGoneChildrenWhenMeasuring() is set to true.
假设这是 CardView
布局:
<androidx.cardview.widget.CardView>
<!-- your contents -->
</androidx.cardview.widget.CardView>
改成:
<androidx.cardview.widget.CardView>
<FrameLayout>
<LinearLayout android:orientation="horizontal">
<View
android:id="@+id/left"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0"
android:background="color1"/>
<View
android:id="@+id/right"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="100"
android:background="color2"/>
</LinearLayout>
<!-- your contents -->
</FrameLayout>
</androidx.cardview.widget.CardView>
并且在代码中:
findViewById<View>(R.id.left).layoutParams = LinearLayout.LayoutParams(
0, LinearLayout.LayoutParams.MATCH_PARENT, x)
findViewById<View>(R.id.right).layoutParams = LinearLayout.LayoutParams(
0, LinearLayout.LayoutParams.MATCH_PARENT, 100f - x)