我如何实现这种滑动导航
How do i achieve this sort of swipe navigation
我有一个包含多个线性布局的网格布局。每个线性布局都包含一个图像视图和一个文本视图。目前所有图像及其描述都出现在屏幕上,但我想创建一个滑动功能,当用户滑动屏幕时,这将使另一组图像出现。我想创造这样的东西
what i want to achieve
这是我的 xml 文件
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4">
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility1"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image1"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility2"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image2"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/alarmclock" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Alarm clock"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility3"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image3"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/dishwasher1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Dish washer"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility4"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image4"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/alarmclock" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Alarm clock"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/dishwasher1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Dish washer"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
</GridLayout>
我猜你需要 ViewPager:
https://developer.android.com/training/animation/screen-slide.html
每个 "grid" 将是单独的片段。
编辑:
另请参阅:它似乎与您想要得到的非常相似:
Android ViewPager with bottom dots
我建议您同时使用 RecycleView 适配器和 cardView....与所有其他方法相比,它非常简单。只是不要忘记在你的 build.gradle
中添加 RecycleView 和 cardView 依赖项
我有一个包含多个线性布局的网格布局。每个线性布局都包含一个图像视图和一个文本视图。目前所有图像及其描述都出现在屏幕上,但我想创建一个滑动功能,当用户滑动屏幕时,这将使另一组图像出现。我想创造这样的东西
what i want to achieve
这是我的 xml 文件
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4">
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility1"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image1"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility2"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image2"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/alarmclock" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Alarm clock"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility3"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image3"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/dishwasher1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Dish washer"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:onClick="facility_click"
android:id="@+id/layout_facility4"
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:id="@+id/image4"
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/alarmclock" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Alarm clock"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/dishwasher1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Dish washer"
android:textAlignment="center"/>
</LinearLayout>
<LinearLayout
android:layout_columnWeight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<ImageView
android:layout_width="50dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:src="@drawable/fridge1" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Fridge"
android:textAlignment="center"/>
</LinearLayout>
</GridLayout>
我猜你需要 ViewPager:
https://developer.android.com/training/animation/screen-slide.html
每个 "grid" 将是单独的片段。
编辑:
另请参阅:它似乎与您想要得到的非常相似: Android ViewPager with bottom dots
我建议您同时使用 RecycleView 适配器和 cardView....与所有其他方法相比,它非常简单。只是不要忘记在你的 build.gradle
中添加 RecycleView 和 cardView 依赖项