文档章节

不同分辨率下网格布局的实现

今日竹石
 今日竹石
发布于 2014/04/24 15:47
字数 1012
阅读 481
收藏 8

实现的效果:

项目布局:

具体代码如下:

1.MainActivity

package com.example.gridlayout_demo;


import java.util.ArrayList;

import java.util.List;


import android.app.Activity;

import android.os.Bundle;

import android.view.View;

import android.view.Window;

import android.widget.GridView;

import android.widget.LinearLayout;


import com.example.gridlayout_demo.common.util.Tools;

import com.example.gridlayout_demo.model.BookInfo;


/**

 * 网格布局的demo

 * 

 * @作者: 刘倩</br>

 * @时间: 2014年4月24日 上午11:35:06</br>

 * @描述: 这个小demo主要是显示网格布局</br>

 */

public class MainActivity extends Activity

{

/** 显示的数据 */

private List<BookInfo> listData = new ArrayList<BookInfo>();

/** 网格布局 */

private GridLayoutAdapter gridLayoutAdapter;

/** 定义GridView */

private GridView gridView;

/** 线性布局 */

private LinearLayout linearLayout;


@Override

protected void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

// 设置无标题状态

requestWindowFeature(Window.FEATURE_NO_TITLE);

initView();

}


/**

* 初始化视图

*/

private void initView()

{

setContentView(R.layout.activity_main);

linearLayout = (LinearLayout) findViewById(R.id.activity_main_ll);

addListData();

getGridView();

}


/**

* 设置网格的布局

*/

private void getGridView()

{

if (gridView == null)

{

gridView = new GridView(MainActivity.this);

int screenWidth = Tools.getScreenWidth();

int screenHeight = Tools.getScreenHeight();

// 适配1024*600 屏幕(7寸手机)

if (screenHeight > 960 && screenHeight <= 1024 && screenWidth > 540

&& screenWidth <= 600)

{

gridView.setNumColumns(4);

} else

{

gridView.setNumColumns(3);

}

}

linearLayout.setVisibility(View.VISIBLE);

linearLayout.addView(gridView);

gridLayoutAdapter = new GridLayoutAdapter(MainActivity.this, listData);

gridView.setAdapter(gridLayoutAdapter);

}


/**

* 设置要显示的数据

*/

private void addListData()

{

int[] drawable =

{ R.drawable.ic_launcher, R.drawable.ic_launcher,

R.drawable.ic_launcher, R.drawable.ic_launcher,

R.drawable.ic_launcher, R.drawable.ic_launcher,

R.drawable.ic_launcher, R.drawable.ic_launcher,

R.drawable.ic_launcher, R.drawable.ic_launcher,

R.drawable.ic_launcher, R.drawable.ic_launcher };

String[] bookName =

{ "总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子",

"总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子", "总裁的小妻子" };

for (int i = 0; i < 12; i++)

{

BookInfo bookInfo = new BookInfo();

bookInfo.setBookIcon(drawable[i]);

bookInfo.setBookName(bookName[i]);

listData.add(bookInfo);

}

}


}


2.GridLayoutAdapter

package com.example.gridlayout_demo;


import java.util.List;


import android.app.Activity;

import android.view.Gravity;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.BaseAdapter;

import android.widget.ImageView;

import android.widget.LinearLayout;

import android.widget.TextView;


import com.example.gridlayout_demo.common.util.Tools;

import com.example.gridlayout_demo.model.BookInfo;


/**

 * 网格布局适配器

 * 

 * @作者: 刘倩</br>

 * @时间: 2014年4月24日 下午1:55:51</br>

 * @描述: 主要实现网格的布局</br>

 */

public class GridLayoutAdapter extends BaseAdapter

{

/** 上下文 */

Activity activity;

/** 填充器 */

LayoutInflater layoutInflater;

/** 数据集合 */

List<BookInfo> listData;


public GridLayoutAdapter(Activity mainActivity, List<BookInfo> listData)

{

this.activity = mainActivity;

this.listData = listData;

layoutInflater = LayoutInflater.from(mainActivity);

}


@Override

public int getCount()

{

// 每行个数

int k = 0;

// 屏幕的宽度

int screenHeight = Tools.getScreenHeight();

// 屏幕的高度

int screenWidth = Tools.getScreenWidth();

if (screenHeight > 960 && screenHeight <= 1024 && screenWidth > 540

&& screenWidth <= 600)

{

k = 4;

} else

{

k = 3;

}

int virtualCount = listData.size();

if (virtualCount % k != 0)

{

virtualCount += (k - virtualCount % k);

}

return virtualCount;

}


@Override

public Object getItem(int position)

{

return listData.get(position);

}


@Override

public long getItemId(int position)

{

return position;

}


@Override

public View getView(int position, View convertView, ViewGroup parent)

{

ViewHolder viewHolder;

if (convertView == null)

{

viewHolder = new ViewHolder();

convertView = layoutInflater.inflate(R.layout.listivew_grid_layout,

null);

viewHolder.ivBookIcon = (ImageView) convertView

.findViewById(R.id.listview_grid_layout_iv_bookicon);

viewHolder.tvBookName = (TextView) convertView

.findViewById(R.id.listview_grid_layout_tv_bookname);

convertView.setTag(viewHolder);

} else

{

viewHolder = (ViewHolder) convertView.getTag();

}

int screenWidth = Tools.getScreenWidth();

int screenHeight = Tools.getScreenHeight();

// 适配1024*600 屏幕(7寸手机)

if (screenHeight > 960 && screenHeight <= 1024 && screenWidth > 540

&& screenWidth <= 600)

{

if (position % 4 == 0)

{// 左边

((LinearLayout) convertView)

.setGravity(Gravity.CENTER_HORIZONTAL);

convertView.setPadding(0, Tools.dipToPixel(5), 0,

Tools.dipToPixel(10));

} else if (position % 4 == 1)

{// 中间

convertView.setPadding(0, Tools.dipToPixel(5), 0,

Tools.dipToPixel(10));

((LinearLayout) convertView)

.setGravity(Gravity.CENTER_HORIZONTAL);

} else if (position % 4 == 2)

{// 右边

convertView.setPadding(0, Tools.dipToPixel(5), 0,

Tools.dipToPixel(10));

((LinearLayout) convertView)

.setGravity(Gravity.CENTER_HORIZONTAL);

} else if (position % 4 == 3)

{

convertView.setPadding(0, Tools.dipToPixel(5), 0,

Tools.dipToPixel(10));

((LinearLayout) convertView)

.setGravity(Gravity.CENTER_HORIZONTAL);

}

} else

{

if (position % 3 == 0)

{// 左边

((LinearLayout) convertView).setGravity(Gravity.RIGHT);

convertView.setPadding(Tools.dipToPixel(3),

Tools.dipToPixel(5), 0, Tools.dipToPixel(10));

} else if (position % 3 == 1)

{// 中间

convertView.setPadding(0, Tools.dipToPixel(5), 0,

Tools.dipToPixel(10));

((LinearLayout) convertView)

.setGravity(Gravity.CENTER_HORIZONTAL);

} else if (position % 3 == 2)

{// 右边

convertView.setPadding(0, Tools.dipToPixel(5),

Tools.dipToPixel(3), Tools.dipToPixel(10));

((LinearLayout) convertView).setGravity(Gravity.LEFT);

}

}


/* 网格布局 */

BookInfo bookInfo = listData.get(position);

viewHolder.ivBookIcon.setBackgroundResource(bookInfo.getBookIcon());

viewHolder.tvBookName.setText(bookInfo.getBookName());

return convertView;

}


/**

* 存放控件的类

* @作者: 刘倩</br>

* @时间: 2014年4月24日 下午1:59:20</br>

* @描述: 这里主要存放书封的ImageView和书名的TextView</br>

*/

class ViewHolder

{

/** 书封 */

ImageView ivBookIcon;

/** 书名 */

TextView tvBookName;

}

}

3.Tools.java

package com.example.gridlayout_demo.common.util;


import com.example.gridlayout_demo.common.application.ApplicationData;


import android.util.DisplayMetrics;


/**

 * 全局的工具类

 * 

 * @作者: 刘倩</br>

 * @时间: 2014年4月24日 下午2:16:20</br>

 * @描述: 全局的工具类,主要是一些常用的方法</br>

 */

public class Tools

{

/**

* 获得屏幕的宽度

* @param context

* @return

*/

public static int getScreenWidth()

{

DisplayMetrics dm = new DisplayMetrics();

dm = ApplicationData.globalContext.getApplicationContext()

.getResources().getDisplayMetrics();

return dm.widthPixels;

}


/**

* 获得屏幕的高度

* @param context

* @return

*/

public static int getScreenHeight()

{

DisplayMetrics dm = new DisplayMetrics();

dm = ApplicationData.globalContext.getApplicationContext()

.getResources().getDisplayMetrics();

return dm.heightPixels;

}


/**

* dip转成pixel

* @param dip

* @return

*/

public static int dipToPixel(float dip)

{

return (int) (dip

* ApplicationData.globalContext.getResources()

.getDisplayMetrics().density + 0.5);

}

}



    源码的下载地址:http://download.csdn.net/detail/u010820846/7245813

© 著作权归作者所有

共有 人打赏支持
今日竹石
粉丝 41
博文 227
码字总数 181312
作品 0
朝阳
程序员
使用 jQuery Mobile 和 CSS3 实现响应式设计

jQuery Mobile 框架是一个 JavaScript 库,您可以用它来轻松地创建了一个移动版本的网站,将现有的 Web 页面转换成触摸友好的网站和应用程序。jQuery Mobile 框架允许用户通过 Web 浏览器直接...

IBMdW
2012/05/27
8.6K
3
响应式布局小结

根据维基百科定义:弹性网格布局、弹性图片和媒体查询整合起来,并将其命名为RWD(Responsive Web Design,响应式布局)。下面分别介绍: 媒体查询 首先看下百度百科对响应式布局定义 百度百...

GTReload
2016/11/21
0
0
UI Layout 的设计

WP8 和 Win8 UI 布局之 XAML XAML 是 eXtensible Application Markup Language 的英文缩写,相应的中文名称为可扩展应用程序标记语言,它是微软公司为构建应用程序用户界面而创建的一种新的描...

失足处男的倒霉孩子
2013/12/24
427
0
十大前端开发框架(下)

本文由伯乐在线 -厉瑶 翻译。未经许可,禁止转载! 英文出处:Site Point。欢迎加入翻译组。 在《十大前端开发框架(上)》中我们了解了跟Bootstrap相关的一系列前端开发框架,如果你对于Boo...

伯乐在线
2013/07/01
0
0
编写第一个响应式页面

本文为大家讲解如何使用一种科学的方法实现网页设计,从原理上搞清楚什么是响应式设计,并实现一个简易的响应式设计框架,以此为基础,编写出第一个响应式页面。 不知道现在大家还读村上春树...

凡尘里的一根葱
2015/11/24
60
0

没有更多内容

加载失败,请刷新页面

加载更多

Java Lock接口分析之ReentantReadWriteLock

ReentantReadWriteLock读写锁,在读线程多余写线程的并发环境中能体现出优异的性能,相比于synchronized与ReentrantLock这种独占式锁的模型,ReentantReadWriteLock采用独占式写锁与共享式读...

我爱春天的毛毛雨
19分钟前
0
0
EFK (Fluentd ElasticSearch Kibana) 采集nginx日志

本文描述如何通过FEK组合集中化nginx的访问日志。本人更喜欢按顺序来命名,所以使用FEK而不是EFK. 首先在nginx服务器上执行以下操作. 安装ruby http://blog.csdn.net/chenhaifeng2016/artic...

xiaomin0322
21分钟前
0
0
一键下载:将知乎专栏导出成电子书

老是有同学问,学了 Python 基础后不知道可以做点什么来提高。今天就再用个小例子,给大家讲讲,通过 Python 和爬虫,可以完成怎样的小工具。 在知乎上,你一定关注了一些不错的专栏(比如 ...

crossin
30分钟前
1
0
synchronized 之 对象锁 和 类锁

一、synchronized(object) 如果object没有被加锁,则获取object的锁;如果object已经被加锁则等待object的锁被释放。 二、需要加锁的情景 多线程共享同一资源会引起线程安全的情况下,才需要...

MyOldTime
31分钟前
6
0
tomcat 单机/多机 部署多应用

一.单机部署多应用: 1.在 linux 下解压安装两个 tomcat:tomcat1, tomcat2; 2.修改 /etc/profile, 增加 tomcat 环境变量: path 中加上 重新加载配置文件 source /etc/profile 3.修改 tomc...

imbiao
42分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部