安卓Andriod使用入门(十三)【九宫格展示图片】

一个人太久都带着假面生活，会渐渐忘了自己本来的样子。

MainActivity.java代码:

package siso.ninegridimg;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}

GridStyleActivity.java代码:

package siso.ninegridimg;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import com.jaeger.ninegridimageview.NineGridImageView;
import com.jaeger.ninegridimgdemo.R;
import com.jaeger.ninegridimgdemo.adapter.PostAdapter;
import com.jaeger.ninegridimgdemo.entity.Post;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

public class GridStyleActivity extends AppCompatActivity {

private RecyclerView mRvPostLister;
private PostAdapter mNineImageAdapter;

private List<Post> mPostList;
private String[] IMG_URL_LIST = {
"http://ac-QYgvX1CC.clouddn.com/36f0523ee1888a57.jpg",
"http://ac-QYgvX1CC.clouddn.com/07915a0154ac4a64.jpg",
"http://ac-QYgvX1CC.clouddn.com/9ec4bc44bfaf07ed.jpg",
"http://ac-QYgvX1CC.clouddn.com/fa85037f97e8191f.jpg",
"http://ac-QYgvX1CC.clouddn.com/de13315600ba1cff.jpg",
"http://ac-QYgvX1CC.clouddn.com/15c5c50e941ba6b0.jpg",
"http://ac-QYgvX1CC.clouddn.com/10762c593798466a.jpg",
"http://ac-QYgvX1CC.clouddn.com/eaf1c9d55c5f9afd.jpg",
"http://ac-QYgvX1CC.clouddn.com/ad99de83e1e3f7d4.jpg",
"http://ac-QYgvX1CC.clouddn.com/233a5f70512befcc.jpg",
};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_recycler);
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));

mRvPostLister = (RecyclerView) findViewById(R.id.rv_post_list);
mRvPostLister.setLayoutManager(new LinearLayoutManager(this));

mPostList = new ArrayList<>();
for (int i = 0; i < 18; i++) {
List<String> imgUrls = new ArrayList<>();
imgUrls.addAll(Arrays.asList(IMG_URL_LIST).subList(0, i % 9));
Post post = new Post("Am I handsome? Am I handsome? Am I handsome?", imgUrls);
mPostList.add(post);
}

mNineImageAdapter = new PostAdapter(this, mPostList, NineGridImageView.STYLE_GRID);
mRvPostLister.setAdapter(mNineImageAdapter);
}
}

FillStyleActivity.java代码:

package siso.ninegridimg;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import com.jaeger.ninegridimageview.NineGridImageView;
import com.jaeger.ninegridimgdemo.R;
import com.jaeger.ninegridimgdemo.adapter.PostAdapter;
import com.jaeger.ninegridimgdemo.entity.Post;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;

/**
* Created by Jaeger on 16/2/24.
*
* Email: chjie.jaeger@gamil.com
* GitHub: https://github.com/laobie */
public class FillStyleActivity extends AppCompatActivity {

private RecyclerView mRvPostLister;
private PostAdapter mPostAdapter;

private List<Post> mPostList;
private String[] IMG_URL_LIST = {
"https://pic4.zhimg.com/02685b7a5f2d8cbf74e1fd1ae61d563b_xll.jpg",
"https://pic4.zhimg.com/fc04224598878080115ba387846eabc3_xll.jpg",
"https://pic3.zhimg.com/d1750bd47b514ad62af9497bbe5bb17e_xll.jpg",
"https://pic4.zhimg.com/da52c865cb6a472c3624a78490d9a3b7_xll.jpg",
"https://pic3.zhimg.com/0c149770fc2e16f4a89e6fc479272946_xll.jpg",
"https://pic1.zhimg.com/76903410e4831571e19a10f39717988c_xll.png",
"https://pic3.zhimg.com/33c6cf59163b3f17ca0c091a5c0d9272_xll.jpg",
"https://pic4.zhimg.com/52e093cbf96fd0d027136baf9b5cdcb3_xll.png",
"https://pic3.zhimg.com/f6dc1c1cecd7ba8f4c61c7c31847773e_xll.jpg",
};

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_recycler);
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));

mRvPostLister = (RecyclerView) findViewById(R.id.rv_post_list);
mRvPostLister.setLayoutManager(new LinearLayoutManager(this));

mPostList = new ArrayList<>();
for (int i = 0; i < 18; i++) {
List<String> imgUrls = new ArrayList<>();
imgUrls.addAll(Arrays.asList(IMG_URL_LIST).subList(0, i % 9 + 1));
Post post = new Post("看图，字不重要。想看大图？抱歉我还没做这个 ( •̀ .̫ •́ )", imgUrls);
mPostList.add(post);
}
mPostAdapter = new PostAdapter(this, mPostList, NineGridImageView.STYLE_FILL);
mRvPostLister.setAdapter(mPostAdapter);
}
}

PostAdapter.java代码:

package siso.ninegridimg.adapter;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

import java.util.List;

import siso.ninegridimg.R;
import siso.ninegridimg.entity.Post;
import siso.nineimglib.NineGridImageView;
import siso.nineimglib.NineGridImageViewAdapter;

public class PostAdapter extends RecyclerView.Adapter<PostAdapter.PostViewHolder> {
private LayoutInflater mInflater;
private List<Post> mPostList;
private int mShowStyle;

public PostAdapter(Context context, List<Post> postList, int showStyle) {
super();
mPostList = postList;
mInflater = LayoutInflater.from(context);
mShowStyle = showStyle;
}

@Override
public void onBindViewHolder(PostViewHolder holder, int position) {
holder.bind(mPostList.get(position));
}

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

@Override
public PostViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
if (mShowStyle == NineGridImageView.STYLE_FILL) {
return new PostViewHolder(mInflater.inflate(R.layout.item_post_fill_style, parent, false));
} else {
return new PostViewHolder(mInflater.inflate(R.layout.item_post_grid_style, parent, false));
}
}

public class PostViewHolder extends RecyclerView.ViewHolder {
private NineGridImageView mNglContent;
private TextView mTvContent;

private NineGridImageViewAdapter<String> mAdapter = new NineGridImageViewAdapter<String>() {
@Override
protected void onDisplayImage(Context context, ImageView imageView, String s) {
Picasso.with(context)
.load(s)
.placeholder(R.drawable.ic_default_image)
.into(imageView);
}

@Override
protected ImageView generateImageView(Context context) {
return super.generateImageView(context);
}

@Override
protected void onItemImageClick(Context context, int index, List<String> list) {
Toast.makeText(context, "image position is " + index, Toast.LENGTH_SHORT).show();
}
};

public PostViewHolder(View itemView) {
super(itemView);
mTvContent = (TextView) itemView.findViewById(R.id.tv_content);
mNglContent = (NineGridImageView) itemView.findViewById(R.id.ngl_images);
mNglContent.setAdapter(mAdapter);
}

public void bind(Post post) {
mNglContent.setImagesData(post.getImgUrlList());
mTvContent.setText(post.getContent());
}
}
}

Post.java代码:

package siso.ninegridimg.entity;

import java.util.List;

public class Post {
private String mContent;
private List<String> mImgUrlList;

public Post() {
}

public Post(String content, List<String> imgUrlList) {
mContent = content;
mImgUrlList = imgUrlList;
}

public String getContent() {
return mContent;
}

public void setContent(String content) {
mContent = content;
}

public List<String> getImgUrlList() {
return mImgUrlList;
}

public void setImgUrlList(List<String> imgUrlList) {
mImgUrlList = imgUrlList;
}
}

activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="siso.ninegridimg.MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
</RelativeLayout>

item_post_fill_style.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ngl="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
android:background="@color/white"
android:orientation="vertical"
android:padding="8dp">

<TextView
android:id="@+id/tv_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:textColor="#333333"
android:textSize="16sp"/>

<com.jaeger.ninegridimageview.NineGridImageView
android:id="@+id/ngl_images"
android:layout_width="match_parent"
android:layout_height="wrap_content"
ngl:imgGap="3dp"
ngl:showStyle="fill"
ngl:singleImgSize="160dp"/>
</LinearLayout>

item_post_grid_style.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_margin="8dp"
android:background="@color/white"
android:orientation="vertical"
android:padding="8dp">

<TextView
android:id="@+id/tv_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:textColor="#333333"
android:textSize="16sp"
tools:text="测试文字"/>

<com.jaeger.ninegridimageview.NineGridImageView
android:id="@+id/ngl_images"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:imgGap="3dp"
app:maxSize="-1"
app:showStyle="grid"
app:singleImgSize="500dp"/>
</LinearLayout>

item_single_image.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxHeight="60dp"
android:maxWidth="60dp"
android:orientation="vertical">
<ImageView
android:id="@+id/iv_single"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"/>

</LinearLayout>

strings.xml

<resources>
<string name="app_name">NineGridImg</string>

<string name="fill_style">Fill Style</string>
<string name="grid_style">Grid Style</string>
</resources>

styles.xml

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="android:textAllCaps">false</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="windowNoTitle">true</item>
<item name="android:textColor">@color/white</item>
<item name="windowActionBar">false</item>
</style>

</resources>

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="siso.ninegridimg">

<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>

</manifest>

build.gradle

apply plugin: 'com.android.application'

android {
compileSdkVersion 23
buildToolsVersion "23.0.1"

defaultConfig {
applicationId "siso.ninegridimg"
minSdkVersion 22
targetSdkVersion 22
versionCode 1
versionName "1.0"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}

dependencies {
compile fileTree(include: ['*.jar'], dir: 'libs')
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.0.1'
compile 'com.android.support:recyclerview-v7:23.3.0'
compile 'com.squareup.picasso:picasso:2.5.2'
compile project(path: ':nineimglib')
}

Andriod类库项目nineimglib

项目运行结果如图: