脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → Android → Android图片九宫格

Android实现图片九宫格

 更新时间：2022年06月28日 14:40:44   作者：hishere  
这篇文章主要为大家详细介绍了Android实现图片九宫格，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了Android实现图片九宫格的具体代码，供大家参考，具体内容如下

九宫格分三类

实现的效果

具体实现

activity_main

<?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">

   <data>

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

        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

item_main

<?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">

    <data>
        <variable
            name="img"
            type="com.nooneb.ninegrid.Img" />
        <import type="android.view.View"/>
    </data>

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="64dp">

        <ImageView
            android:id="@+id/oneImg"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOne()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img1}" />

        <ImageView
            android:id="@+id/twoImg1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isTwoOrFour()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="w,1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline2"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img1}" />

        <ImageView
            android:id="@+id/twoImg2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isTwoOrFour()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="@+id/guideline2"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img2}" />

        <ImageView
            android:id="@+id/twoImg3"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isFour()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="w,1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline2"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/twoImg1"
            app:localImg="@{img.img3}" />

        <ImageView
            android:id="@+id/twoImg4"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isFour()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="@+id/guideline2"
            app:layout_constraintTop_toBottomOf="@+id/twoImg2"
            app:localImg="@{img.img4}" />

        <ImageView
            android:id="@+id/threeImg1"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="w,1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline3"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img1}" />

        <ImageView
            android:id="@+id/threeImg2"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline4"
            app:layout_constraintStart_toStartOf="@+id/guideline3"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img2}" />

        <ImageView
            android:id="@+id/threeImg3"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="@+id/guideline4"
            app:layout_constraintTop_toTopOf="parent"
            app:localImg="@{img.img3}" />

        <ImageView
            android:id="@+id/threeImg4"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline3"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/threeImg1"
            app:localImg="@{img.img4}" />

        <ImageView
            android:id="@+id/threeImg5"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline4"
            app:layout_constraintStart_toStartOf="@+id/guideline3"
            app:layout_constraintTop_toBottomOf="@+id/threeImg2"
            app:localImg="@{img.img5}" />

        <ImageView
            android:id="@+id/threeImg7"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline3"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/threeImg4"
            app:localImg="@{img.img7}" />

        <ImageView
            android:id="@+id/threeImg8"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toStartOf="@+id/guideline4"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="@+id/guideline3"
            app:layout_constraintTop_toBottomOf="@+id/threeImg5"
            app:localImg="@{img.img8}" />

        <ImageView
            android:id="@+id/threeImg6"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="@+id/guideline4"
            app:layout_constraintTop_toBottomOf="@+id/threeImg3"
            app:localImg="@{img.img6}" />

        <ImageView
            android:id="@+id/threeImg9"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:visibility="@{img.isOther()?View.VISIBLE:View.GONE}"
            app:layout_constraintDimensionRatio="1:1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.0"
            app:layout_constraintStart_toStartOf="@+id/guideline4"
            app:layout_constraintTop_toBottomOf="@+id/threeImg6"
            app:localImg="@{img.img9}" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/guideline2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent=".5" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/guideline3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent=".333333" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/guideline4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent=".666666" />

    </androidx.constraintlayout.widget.ConstraintLayout>
</layout>

实体类

public class Img {
    public Integer img1;
    public Integer img2;
    public Integer img3;
    public Integer img4;
    public Integer img5;
    public Integer img6;
    public Integer img7;
    public Integer img8;
    public Integer img9;

    public Img(Integer img1, Integer img2, Integer img3, Integer img4, Integer img5, Integer img6, Integer img7, Integer img8, Integer img9) {
        this.img1 = img1;
        this.img2 = img2;
        this.img3 = img3;
        this.img4 = img4;
        this.img5 = img5;
        this.img6 = img6;
        this.img7 = img7;
        this.img8 = img8;
        this.img9 = img9;
    }

    public int count(){
        int i=0;
        if (img1!=null)i++;
        if (img2!=null)i++;
        if (img3!=null)i++;
        if (img4!=null)i++;
        if (img5!=null)i++;
        if (img6!=null)i++;
        if (img7!=null)i++;
        if (img8!=null)i++;
        if (img9!=null)i++;
        return i;
    }
    public boolean isOne(){
        return count()==1;
    }
    public boolean isTwoOrFour(){
        return count()==2||count()==4;
    }
    public boolean isFour(){
        return count()==4;
    }
    public boolean isOther(){
        if (count()!=1){
            if (count()!=2){
                return count() != 4;
            }
        }
        return false;
    }
}

图片适配器

public class ImgAdapter {
    @BindingAdapter("localImg")
    public static void set(ImageView imageView,Integer res){
        if (res==null){
            imageView.setVisibility(View.GONE);
            return;
        }
        imageView.setImageResource(res);

    }
}

列表适配器

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.Holder> {

    private final Context context;
    public List<Img> imgs;

    public MyAdapter(Context context,List<Img> imgs) {
        this.context = context;
        this.imgs=imgs;
    }

    @NonNull
    @Override
    public Holder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        ItemImgBinding binding = ItemImgBinding.inflate(
                LayoutInflater.from(context),
                parent,
                false);
        return new Holder(binding);
    }

    @Override
    public void onBindViewHolder(@NonNull Holder holder, int position) {
        Img img = imgs.get(position);
        holder.binding.setImg(img);
        holder.binding.executePendingBindings();
    }

    @Override
    public int getItemViewType(int position) {
        return position;
    }

    @Override
    public int getItemCount() {
        return imgs.size();
    }

    public class Holder extends RecyclerView.ViewHolder {
        ItemImgBinding binding;
        public Holder(ItemImgBinding binding) {
            super(binding.getRoot());
            this.binding=binding;
        }
    }
}

MainActivity

public class MainActivity extends AppCompatActivity {

    ActivityMainBinding binding;
    MyAdapter myAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ActivityMainBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());

        List<Img> imgs = Arrays.asList(
                new Img(R.drawable.avatar_1, null, null, null, null, null, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, null, null, null, null, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, null, null, null, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, null, null, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, R.drawable.avatar_5, null, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, R.drawable.avatar_5, R.drawable.avatar_6, null, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, R.drawable.avatar_5, R.drawable.avatar_6, R.drawable.avatar_7, null, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, R.drawable.avatar_5, R.drawable.avatar_6, R.drawable.avatar_7, R.drawable.avatar_8, null),
                new Img(R.drawable.avatar_1, R.drawable.avatar_2, R.drawable.avatar_3, R.drawable.avatar_4, R.drawable.avatar_5, R.drawable.avatar_6, R.drawable.avatar_7, R.drawable.avatar_8, R.drawable.avatar_9)
        );

        myAdapter=new MyAdapter(this,imgs);
        binding.recyclerView.setLayoutManager(new LinearLayoutManager(this));
        binding.recyclerView.addItemDecoration(new DividerItemDecoration(this,DividerItemDecoration.VERTICAL));
        binding.recyclerView.setAdapter(myAdapter);
    }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • Android高效安全加载图片的方法详解

    Android高效安全加载图片的方法详解

    Android开发中消耗内存较多一般都是在图像上面，下面这篇文章主要给大家介绍了关于Android如何高效安全加载图片的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
    2019-02-02
  • Android ListView下拉刷新上拉自动加载更多DEMO示例

    Android ListView下拉刷新上拉自动加载更多DEMO示例

    这篇文章主要介绍了Android ListView下拉刷新上拉自动加载更多DEMO示例的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
    2016-07-07
  • Android WebView的使用方法及与JS 相互调用

    Android WebView的使用方法及与JS 相互调用

    这篇文章主要介绍了Android WebView的使用方法及与JS 相互调用的相关资料,WebView 是 Android 中一个非常实用的组&#8203;件， WebView 可以使得网页轻松的内嵌到app里，还可以直接跟js相互调用,需要的朋友可以参考下
    2017-07-07
  • Android编程开发之NotiFication用法详解

    Android编程开发之NotiFication用法详解

    这篇文章主要介绍了Android编程开发之NotiFication用法,结合实例形式较为详细的分析了NotiFication的功能、使用技巧与注意事项,需要的朋友可以参考下
    2015-12-12
  • Android开发之电话拨号器和短信发送器实现方法

    Android开发之电话拨号器和短信发送器实现方法

    这篇文章主要介绍了Android开发之电话拨号器和短信发送器实现方法,结合实例形式较为详细的分析了Android电话拨号器和短信发送器的具体原理与实现步骤,需要的朋友可以参考下
    2015-12-12
  • Handler消息传递机制类引入及执行流程详解

    Handler消息传递机制类引入及执行流程详解

    这篇文章主要为大家介绍了Handler消息传递机制类引入及执行流程详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
    2023-04-04
  • Android Fragment的静态注册和动态注册创建步骤

    Android Fragment的静态注册和动态注册创建步骤

    这篇文章主要介绍了Android Fragment的静态注册和动态注册创建步骤，本文给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-02-02
  • Kotlin List与Set和Map实例讲解

    Kotlin List与Set和Map实例讲解

    集合是可变数量（可能为0）的一组条目，kotlin标准库提供一个整套用于集合管理的工具，各种集合对于解决问题都具有重要意义，并且经常用到。kotlin中的集合与Java基本类似
    2022-10-10
  • android生命周期深入分析(一)

    android生命周期深入分析(一)

    Android 程序的生命周期是由系统控制而非程序自身直接控制,本文将详细介绍，需要的朋友可以参考下
    2012-12-12
  • Flutter 给列表增加下拉刷新和上滑加载更多功能

    Flutter 给列表增加下拉刷新和上滑加载更多功能

    在实际的 App 中，下拉刷新和上滑加载更多是非常常见的交互形式。在 Flutter 中，有 flutter_easyrefresh开源插件用于实现下拉刷新和上滑加载更多。本篇介绍了有状态组件和 flutter_easyrefresh 的基本应用，同时使用模拟的方式完成了异步数据加载。
    2021-05-05

最新评论