android:显示多个图像,如 Tinder 卡片内部
android: Displaying multiple images like INSIDE the Tinder-cards
我将如何像 Tinder 那样显示多张图片:当我点击图片的右侧时它应该显示下一张图片,当我点击图片的左侧时它应该显示上一张图片.
它还应该仅在单击时显示一个向右或向左的小箭头,并以某种方式显示正在显示的图片(带有像火种或点之类的小条)。
有图书馆吗?
编辑:
澄清一下:我已经在 Diolor/Swipecards 库的帮助下实现了 Tinder 刷卡。令人惊讶的是,我有点坚持的是在 Tinder 刷卡器中实现 图片库 。只有上图看到的部分。
有很多适合您的库
https://github.com/janishar/PlaceHolderView
https://github.com/yuyakaido/CardStackView
我的解决方案是添加两张箭头图片,在它们上面放置两个布局,然后为布局添加 onClickListeners,select 适配器中的 next/previous 图片将显示在 ImageView 中。
布局 .xml 文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:layout_gravity="center"
android:clipToPadding="false"
android:outlineProvider="bounds"
android:paddingLeft="10sp"
android:paddingTop="10sp"
android:paddingRight="10sp"
android:paddingBottom="100sp">
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:elevation="2dp"
app:cardCornerRadius="4dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<ImageView
android:id="@+id/imageViewMainBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@mipmap/ic_user_default" />
<ImageView
android:id="@+id/imageNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|end"
android:scaleType="centerCrop"
android:src="@drawable/outline_keyboard_arrow_right_black_48" />
<ImageView
android:id="@+id/imagePrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:scaleType="centerCrop"
android:src="@drawable/outline_keyboard_arrow_left_black_48" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<LinearLayout
android:id="@+id/previousLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".50"
android:orientation="horizontal" />
<LinearLayout
android:id="@+id/nextLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="end"
android:layout_weight=".50"
android:orientation="horizontal" />
</LinearLayout>
<TextView
android:id="@+id/nameTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:padding="20sp"
android:shadowColor="@color/colorBlack"
android:shadowRadius="20"
android:textColor="@color/colorWhite"
android:textSize="30sp"
tools:text="hello" />
<ImageView
android:id="@+id/infoImageViewItemCard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:scaleType="centerCrop"
android:padding="20sp"
android:shadowColor="@color/colorBlack"
android:shadowRadius="20"
android:src="@drawable/outline_info_white_48" />
<LinearLayout
android:id="@+id/bottomLayout"
android:layout_width="match_parent"
android:layout_height="110dp"
android:layout_gravity="bottom"
android:orientation="horizontal" />
</FrameLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
我将如何像 Tinder 那样显示多张图片:当我点击图片的右侧时它应该显示下一张图片,当我点击图片的左侧时它应该显示上一张图片.
它还应该仅在单击时显示一个向右或向左的小箭头,并以某种方式显示正在显示的图片(带有像火种或点之类的小条)。
有图书馆吗?
编辑: 澄清一下:我已经在 Diolor/Swipecards 库的帮助下实现了 Tinder 刷卡。令人惊讶的是,我有点坚持的是在 Tinder 刷卡器中实现 图片库 。只有上图看到的部分。
有很多适合您的库
https://github.com/janishar/PlaceHolderView
https://github.com/yuyakaido/CardStackView
我的解决方案是添加两张箭头图片,在它们上面放置两个布局,然后为布局添加 onClickListeners,select 适配器中的 next/previous 图片将显示在 ImageView 中。
布局 .xml 文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="match_parent"
android:layout_gravity="center"
android:clipToPadding="false"
android:outlineProvider="bounds"
android:paddingLeft="10sp"
android:paddingTop="10sp"
android:paddingRight="10sp"
android:paddingBottom="100sp">
<android.support.v7.widget.CardView
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:elevation="2dp"
app:cardCornerRadius="4dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<ImageView
android:id="@+id/imageViewMainBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="@mipmap/ic_user_default" />
<ImageView
android:id="@+id/imageNext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|end"
android:scaleType="centerCrop"
android:src="@drawable/outline_keyboard_arrow_right_black_48" />
<ImageView
android:id="@+id/imagePrevious"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:scaleType="centerCrop"
android:src="@drawable/outline_keyboard_arrow_left_black_48" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="1">
<LinearLayout
android:id="@+id/previousLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".50"
android:orientation="horizontal" />
<LinearLayout
android:id="@+id/nextLayout"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_gravity="end"
android:layout_weight=".50"
android:orientation="horizontal" />
</LinearLayout>
<TextView
android:id="@+id/nameTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:padding="20sp"
android:shadowColor="@color/colorBlack"
android:shadowRadius="20"
android:textColor="@color/colorWhite"
android:textSize="30sp"
tools:text="hello" />
<ImageView
android:id="@+id/infoImageViewItemCard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:scaleType="centerCrop"
android:padding="20sp"
android:shadowColor="@color/colorBlack"
android:shadowRadius="20"
android:src="@drawable/outline_info_white_48" />
<LinearLayout
android:id="@+id/bottomLayout"
android:layout_width="match_parent"
android:layout_height="110dp"
android:layout_gravity="bottom"
android:orientation="horizontal" />
</FrameLayout>
</android.support.v7.widget.CardView>
</LinearLayout>