仿百度壁纸客户端（六）——完结篇之Gallery画廊实现壁纸预览已经项目细节优化

仿百度壁纸客户端（六）——完结篇之Gallery画廊实现壁纸预览已经项目细节优化

百度壁纸系列

仿百度壁纸客户端（一）——主框架搭建,自定义Tab + ViewPager + Fragment

仿百度壁纸客户端（二）——主页自定义ViewPager广告定时轮播图

仿百度壁纸客户端（三）——首页单向，双向事件冲突处理，壁纸列表的实现

仿百度壁纸客户端（四）——自定义上拉加载实现精选壁纸墙

仿百度壁纸客户端（五）——实现搜索动画GestureDetector手势识别，动态更新搜索关键字

仿百度壁纸客户端（六）——完结篇之Gallery画廊实现壁纸预览已经项目细节优化

我们这里有一个细节还没有实现，我们先看一下官方的效果



这个学名叫做Gallery画廊，我们今天也来实现它，我们在精选的Fragment中给GradView设置点击事件，让他跳转到画廊，实际开发当中是获取当前点击的图片的，这里我们就只能模拟图片了

myGridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
startActivity(new Intent(getActivity(), GalleryActivity.class));
}
});

跳转的Activity就是我们今天来实现的，我们先来下个布局

layout_gallery.xml

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

<Gallery
android:id="@+id/myGallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center_horizontal"
android:orientation="vertical">

<LinearLayout
android:layout_width="150dp"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/image_view_button_set_as_wallpaper" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="设置壁纸"
android:textColor="#fff" />
</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:orientation="horizontal">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/image_view_button_preview" />

<TextView

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="预览"
android:textColor="#fff" />

</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/image_view_button_download" />

<TextView

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="下載"
android:textColor="#fff" />

</LinearLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">

<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="@drawable/image_view_button_share" />

<TextView

android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="分享"
android:textColor="#fff" />

</LinearLayout>

</LinearLayout>

</LinearLayout>

</RelativeLayout>

然后开始实现了，这个不是什么难的技术，只是一个容器，我们还得定义一个Adapter，这里直接放上代码，毕竟就几行代码

package com.lgl.baiduwallpaper;

import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Gallery;
import android.widget.ImageView;

import java.util.ArrayList;

/**
* 画廊效果
* Created by lgl on 16/4/9.
*/
public class GalleryActivity extends Activity {

//画廊
private Gallery mGallery;
private ArrayList<Integer> srcData = new ArrayList<>();

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.layout_gallery);

init();
}

private void init() {
mGallery = (Gallery) findViewById(R.id.myGallery);
initData();
mGallery.setAdapter(new myAdapter(this));
}

/**
* 初始化数据
*/
private void initData() {
//这里模拟四张，实际开发中需要自己去获取
srcData.add(R.mipmap.img1);
srcData.add(R.mipmap.img2);
srcData.add(R.mipmap.img3);
srcData.add(R.mipmap.img4);
}

private class myAdapter extends BaseAdapter {

private Context mContext;

public myAdapter(Context mContext) {
this.mContext = mContext;
}

@Override
public int getCount() {
return srcData.size();
}

@Override
public Object getItem(int position) {
return srcData.get(position);
}

@Override
public long getItemId(int position) {
return position;
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {

ImageView imageView = new ImageView(mContext);
imageView.setBackgroundResource(srcData.get(position));
imageView.setLayoutParams(new Gallery.LayoutParams(Gallery.LayoutParams.MATCH_PARENT, Gallery.LayoutParams.WRAP_CONTENT));

return imageView;
}
}
}

记得在清单文件注册哦

我们来运行一下

项目细节处理

换上LOGO



这个项目还是得按流畅来一遍，所以，引导页少不了的

IndexActivity

package com.lgl.baiduwallpaper;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;

/**
* Created by lgl on 16/4/9.
*/
public class IndexActivity extends Activity {

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

new Thread(new Runnable() {
@Override
public void run() {
try {
Thread.sleep(2000);
startActivity(new Intent(IndexActivity.this, MainActivity.class));
finish();
} catch (InterruptedException e) {
e.printStackTrace();
}
}
}).start();
}
}

对应的布局

activity_index.xml

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

<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="30dp"
android:text="百度壁纸"
android:textSize="50dp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv_title"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:text="每天换壁纸，天天好心情" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:src="@drawable/welcome_bottom" />

</RelativeLayout>

运行结果



接下来，我们把title完善一下，首先是精选

<RelativeLayout
android:id="@+id/rl_title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:alpha="0.8"
android:background="#000">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="精选"
android:textColor="#fff"
android:textSize="16sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:text="刷新"
android:textColor="#fff"
android:textSize="16sp" />

</RelativeLayout>

然後就是搜索了

<RelativeLayout
android:id="@+id/rl_title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:alpha="0.8"
android:background="#000">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="搜索"
android:textColor="#fff"
android:textSize="16sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:text="确定"
android:textColor="#fff"
android:textSize="16sp" />

</RelativeLayout>

<RelativeLayout
android:id="@+id/rl_search"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@+id/rl_title"
android:layout_margin="10dp">

<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/image_search_button" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_search_clear_button_selected" />

</RelativeLayout>

接著是本地，本地我们不实现它的功能，就写个布局吧

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

<RelativeLayout
android:id="@+id/rl_title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:alpha="0.8"
android:background="#000">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="本地"
android:textColor="#fff"
android:textSize="16sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:text="删除"
android:textColor="#fff"
android:textSize="16sp" />

</RelativeLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/image_manage_no_wallpaper_logo" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你本地还没有壁纸，快来下载些吧！" />

<Button
android:background="@drawable/button_pressed"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:text="精选"
android:textColor="#fff" />

</LinearLayout>
</LinearLayout>

最後就是設置了

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:orientation="vertical">

<RelativeLayout
android:id="@+id/rl_title"
android:layout_width="match_parent"
android:layout_height="50dp"
android:alpha="0.8"
android:background="#000">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="设置"
android:textColor="#fff"
android:textSize="16sp" />

<TextView
android:visibility="gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:text="确定"
android:textColor="#fff"
android:textSize="16sp" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="自动更换壁纸" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="一鍵更换壁纸" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="图片浏览之类" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:text="自动" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="清除缓存" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item"
android:visibility="invisible" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="检查更新" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item"
android:visibility="invisible" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="帮助手册" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="意见反馈" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item" />

</RelativeLayout>

<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="@drawable/image_more_subitems_bottom"
android:gravity="center_vertical">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="关于我们" />

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/image_list_open_item" />

</RelativeLayout>

</LinearLayout>

我们完整的预览一遍



感兴趣的可以下载Demo玩玩

Demo下载：http://download.csdn.net/detail/qq_26787115/9485945