【问题标题】:CardView doesn't expand properlyCardView 没有正确展开
【发布时间】:2018-06-21 07:20:51
【问题描述】:

card screenshot

我有一个扩展 CardView 的 TimerView 类。它最初是折叠的,只显示第一行,然后在点击时展开。问题是它没有像应有的那样扩展。在截图中你可以看到底部的图片比其他图片小,但三张图片的分辨率都是一样的。

这是使它展开的代码。 clicked 变量是静态的,我只用它来测量卡片的高度,因为所有卡片都是一样的。

@Override
protected void onFinishInflate(){
    super.onFinishInflate();

    RelativeLayout upperCard = findViewById(R.id.upper_card);

    upperCard.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View view) {
                LinearLayout subCard = findViewById(R.id.sub_card);

                if(!clicked){
                    foldedHeight = getMeasuredHeightAndState();
                    subCard.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED),
                            MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
                    targetHeight = foldedHeight + subCard.getMeasuredHeightAndState();
                    clicked = true;
                }

                if(subCard.getVisibility() == View.GONE) {
                    subCard.setVisibility(View.VISIBLE);
                    ImageView arrow = findViewById(R.id.arrow);
                    arrow.setImageBitmap(BitmapFactory.decodeResource(getResources(), R.drawable.ic_keyboard_arrow_up_black_24dp));
                    ValueAnimator valueAnimator = ValueAnimator.ofInt(foldedHeight, targetHeight);
                    valueAnimator.setDuration(200);
                    valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
                    valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                        public void onAnimationUpdate(ValueAnimator animation) {
                            Integer value = (Integer) animation.getAnimatedValue();
                            getLayoutParams().height = value.intValue();
                            requestLayout();
                        }
                    });
                    valueAnimator.start();
                }
...

这是与TimerView相关的xml文件。

<com.whatever.marco272.timepassedsince.TimerView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
card_view:cardCornerRadius="5dp"
card_view:contentPadding="7dp"
card_view:cardElevation="3dp"
card_view:cardUseCompatPadding="true"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground">

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <RelativeLayout
        android:id="@+id/upper_card"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <TextView
            android:id="@+id/title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="left"
            android:layout_marginRight="24dp"
            android:textSize="24sp"
            android:textStyle="normal|bold"
            android:textColor="@android:color/holo_blue_dark"
            android:text="Title" />

        <TextView
            android:id="@+id/days"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/title"
            android:layout_gravity="bottom"
            android:textSize="24sp"
            android:textStyle="normal|bold"
            android:textColor="@android:color/black"
            android:text="0" />

        <ImageView
            android:id="@+id/arrow"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:src="@drawable/ic_keyboard_arrow_down_black_24dp"/>

</RelativeLayout>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/sub_card"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:visibility="gone">

        <TextView
            android:id="@+id/clock"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:textSize="20sp"
            android:textColor="@android:color/black"
            android:text="0" />

        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/add_button"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_marginBottom="10dp"
            android:gravity="center_vertical">
            <ImageView
                android:src="@drawable/ic_add_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="Update"/>
        </LinearLayout>

        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/edit_button"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:layout_marginBottom="10dp"
            android:gravity="center_vertical">
            <ImageView
                android:src="@drawable/ic_edit_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="Edit"/>
        </LinearLayout>

        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/delete_button"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:gravity="center_vertical">
            <ImageView
                android:src="@drawable/ic_delete_button"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginRight="10dp" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="18sp"
                android:text="Delete"/>
        </LinearLayout>

    </LinearLayout>
</LinearLayout>

【问题讨论】:

    标签: java android xml animation cardview


    【解决方案1】:

    我怀疑这与CardView 的填充有关。在棒棒糖之前的 API 级别上,CardView 会覆盖您设置的任何填充以插入卡片(以便它可以在视图边界内绘制“阴影”)。由于您已经设置了card_view:cardUseCompatPadding="true" 属性,这会在 Lollipop 及更高版本上发生。

    我相信当您展开时,此填充会导致“缺失”高度。

    【讨论】:

    • 如果没有这条线,它会按预期工作,但我希望这张卡出现,如果我没记错的话,它会使 API 级别之间的设计保持一致。顺便说一句,我添加了card_view:cardPreventCornerOverlap="true",它似乎工作正常。这可能是一个解决方案吗?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-07-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多