Android将CardView设置为RecyclerView高度的一半

时间:2019-06-19 00:06:53

标签: android android-recyclerview android-cardview

设置:

我有一个Activity,其中包含一个BottomNavBar +片段,其中包含我的RecyclerView。 RecyclerView应该占据BottomNavBar上方的所有空间。 RecyclerView始终会支付2个CardView,每个CardView都应占用RecyclerView的空间的50%(因此,基本上rVHeight = ScreenHeight-BottomNavBarHeight)。似乎很容易,但我不知道如何做到这一点。

问题:

  1. RecyclerView占据整个屏幕,不尊重NavBarHeight。

  2. 计算值似乎与实际屏幕尺寸不匹配...

activity.xml

<?xml version="1.0" encoding="utf-8"?>
<layout
        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"
>

    <androidx.drawerlayout.widget.DrawerLayout
            android:id="@+id/drawerLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true">



        <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                tools:context=".ui.MainActivity">

            <fragment
                    android:id="@+id/navHostFragment"
                    android:name="androidx.navigation.fragment.NavHostFragment"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    app:defaultNavHost="true"
                    app:navGraph="@navigation/nav_main"
                    android:clipToPadding="false"
                    android:layout_above="@+id/bottomNavView"

            />

            <com.google.android.material.bottomnavigation.BottomNavigationView
                    android:id="@+id/bottomNavView"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@android:color/white"
                    app:menu="@menu/menu_bottom_nav"
                    app:labelVisibilityMode="unlabeled"
                    android:layout_alignParentBottom="true"
            />

        </RelativeLayout>


        <com.google.android.material.navigation.NavigationView
                android:id="@+id/drawerNavView"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_gravity="start"
                android:background="#ffffff"
                app:itemIconTint="#8b8b8b"
                app:itemTextColor="#666666"
                app:menu="@menu/drawer_menu" />

    </androidx.drawerlayout.widget.DrawerLayout>

</layout>

fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_height="match_parent"
                android:layout_width="match_parent"
                xmlns:android="http://schemas.android.com/apk/res/android">


    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerViewClash"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:nestedScrollingEnabled="false">

    </androidx.recyclerview.widget.RecyclerView>

</RelativeLayout>

card_item.xml

<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.card.MaterialCardView
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:card_view="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"

        card_view:cardElevation="8dp"
        card_view:cardCornerRadius="4dp">


    <androidx.constraintlayout.widget.ConstraintLayout
             android:layout_width="match_parent"
             android:layout_height="match_parent">

        <!--*************visible part****************************-->
        <RelativeLayout
                android:id="@+id/ivRoot"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                card_view:layout_constraintTop_toTopOf="parent"
                card_view:layout_constraintBottom_toTopOf="@id/relLayoutHashtags"
                card_view:layout_constraintStart_toStartOf="parent"
                card_view:layout_constraintEnd_toEndOf="parent"
        >

            <ImageView
                    android:id="@+id/clash_image"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:scaleType="centerCrop"
                    android:src="@drawable/image_placeholder"/>
            <View
                    android:id="@+id/vBgWin"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@drawable/bg_win_circle_background"
                    android:visibility="gone"/>

            <ImageView
                    android:id="@+id/ivWin"
                    android:layout_width="80dp"
                    android:layout_height="80dp"
                    android:scaleType="center"
                    android:src="@drawable/ic_win_white"
                    android:layout_centerInParent="true"
                    android:visibility="invisible"/>


            <!--*****************invisible part to expand on click****************************-->


            <RelativeLayout
                    android:id="@+id/rlCollapsingPart"
                    android:layout_width="match_parent"
                    android:layout_height="100dp"
                    android:visibility="invisible">
<!--                    android:layout_alignParentBottom="true"-->


                <FrameLayout
                        android:id="@+id/bgCollapsingPart"
                        android:layout_width="match_parent"
                             android:layout_height="match_parent"
                            android:background="@color/white"
                            android:alpha="0.5">
                </FrameLayout>



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

                    <RelativeLayout
                            android:id="@+id/relLayoutThumbnail"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentStart="true">

                        <de.hdodenhof.circleimageview.CircleImageView
                                android:id="@+id/avatarThumbnail"
                                style="@style/icon"
                                android:src="@drawable/defaultavatar"/>

                        <TextView
                                android:id="@+id/username_text"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                tools:text="willsmith"
                                android:textColor="@color/black"
                                android:textStyle="bold"
                                android:layout_toEndOf="@+id/avatarThumbnail"
                                android:layout_centerVertical="true"/>



                        <ImageView
                                android:id="@+id/comment_image"
                                android:layout_height="45dp"
                                android:layout_width="45dp"
                                android:padding="10dp"
                                android:src="@drawable/ic_comment"
                                android:layout_toStartOf="@+id/bookmark_image"/>

                        <ImageView
                                android:id="@+id/bookmark_image"
                                android:layout_height="45dp"
                                android:layout_width="45dp"
                                android:padding="10dp"
                                android:src="@drawable/ic_bookmark"
                                android:layout_toStartOf="@+id/more_image"/>

                        <ImageView
                                android:id="@+id/more_image"
                                android:layout_alignParentEnd="true"
                                android:layout_height="45dp"
                                android:layout_width="45dp"
                                android:padding="10dp"
                                android:src="@drawable/ic_more_vert_black"/>

                    </RelativeLayout>



                    <TextView
                            android:id="@+id/caption_text"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:paddingStart="10dp"
                            android:textColor="@color/black"
                            android:layout_alignParentStart="true"
                            android:layout_below="@+id/relLayoutThumbnail"
                            tools:text="willsmith This is a caption for the post. It's actually a very long caption."/>

                </RelativeLayout>




            </RelativeLayout>

        </RelativeLayout>





        <RelativeLayout
                android:id="@+id/relLayoutHashtags"
                android:layout_width="match_parent"
                android:layout_height="24dp"
                card_view:layout_constraintTop_toBottomOf="@+id/ivRoot"
                card_view:layout_constraintStart_toStartOf="parent"
                card_view:layout_constraintEnd_toStartOf="@+id/expand">


            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:paddingLeft="5dp"
                      android:paddingRight="5dp"
                      android:text="#Hashtag1"
                      android:id="@+id/tv1"/>

            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:paddingLeft="5dp"
                      android:paddingRight="5dp"
                      android:text="#Hashtag2sdf"
                      android:id="@+id/tv2"
                      android:layout_toEndOf="@+id/tv1"/>

            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:paddingLeft="5dp"
                      android:paddingRight="5dp"
                      android:text="#Hashtagdsfgdfg1"
                      android:id="@+id/tv3"
                      android:layout_toEndOf="@+id/tv2"/>


        </RelativeLayout>

        <ImageView
                android:id="@+id/expand"
                android:src="@drawable/ic_expand"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                card_view:layout_constraintEnd_toEndOf="parent"
                card_view:layout_constraintTop_toBottomOf="@+id/ivRoot"/>


    </androidx.constraintlayout.widget.ConstraintLayout>

</com.google.android.material.card.MaterialCardView>

Adapter.kt

就像我解释的那样,我尝试计算RecyclerView允许的空间,该空间应该为TotalScreenHeight - BottomNavBarHeight。然后,我应该有rVHeight/2 - 24*2-16(对于带有TextViews的小条,它的值为24 * 2,对于2 * 8dp边距的值为16)。我还调整了图像本身的大小,或者由于WRAP_CONTENT和Glide的工作方式而使图像变大了。

override fun onBindViewHolder(holder: ViewHolder, position: Int) {

    val photo = photos[position]
    val width = holder.view.resources.displayMetrics.widthPixels
    val height = holder.view.resources.displayMetrics.heightPixels
    val rVHeight = height-navHeight

    holder.view.ivRoot.layoutParams.height = rVHeight/2-(24*2+16) //resize container for hidden views
    with(holder.view) {
        GlideApp.with(holder.view.context).load(photo.imageURL)
            .diskCacheStrategy(DiskCacheStrategy.ALL)
            .override(width,rVHeight/2-(24*2+16)) //resize to load proper height
            .into(clash_image)
             ...
    }

外观的快速图像。如您所见,底部的CardView被切掉了。

enter image description here

0 个答案:

没有答案