devbox
小惠珠哦
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

Android 九宫格布局_android九宫格布局

作者：小惠珠哦 | 2024-08-08 19:10:34

赞

踩

android九宫格布局

效果图

实现思路：

1.使用GridView来实现九宫格布局，设置numColumns=3。

2.图标使用的是Font Awesome矢量图标，详情可以参考Android 在APP中使用 Font Awesome 图标_.fa-headphones_清山博客的博客-CSDN博客

实现步骤：

1.布局文件：activity_main.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     xmlns:app="http://schemas.android.com/apk/res-auto"
  4.     xmlns:tools="http://schemas.android.com/tools"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     tools:context=".MainActivity"
  8.     android:orientation="vertical">
  9.     <!--标题-->
  10.     <LinearLayout
  11.         android:layout_width="match_parent"
  12.         android:layout_height="wrap_content"
  13.         android:textAlignment="center">
  14.         <TextView
  15.             android:id="@+id/txtTitle"
  16.             android:layout_width="wrap_content"
  17.             android:layout_height="wrap_content"
  18.             android:layout_marginTop="60dp"
  19.             android:textColor="@color/black"
  20.             android:textSize="20dp"
  21.             android:layout_weight="1"
  22.             android:text="@string/app_name"
  23.             android:textAlignment="center" />
  24.     </LinearLayout>
  25.  
  26.     <!--九宫格-->
  27.     <LinearLayout
  28.         android:layout_width="match_parent"
  29.         android:layout_height="wrap_content"
  30.         android:layout_weight="0.2"
  31.         android:gravity="top"
  32.         android:orientation="vertical"
  33.         android:padding="10dp"
  34.         android:textAlignment="center">
  35.  
  36.         <GridView
  37.             android:id="@+id/gridView"
  38.             android:layout_width="match_parent"
  39.             android:layout_height="wrap_content"
  40.             android:layout_centerInParent="true"
  41.             android:numColumns="3"
  42.             android:stretchMode="columnWidth"
  43.             android:verticalSpacing="25dp"></GridView>
  44.     </LinearLayout>
  45.  
  46.  
  47. </LinearLayout>

就一个标题和一个GridView两部分组成。

activity_main_menu_item.xml

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:id="@+id/layMenu"
  4.     android:layout_width="match_parent"
  5.     android:layout_height="match_parent"
  6.     android:layout_columnWeight="1"
  7.     android:gravity="center"
  8.     android:orientation="vertical"
  9.     android:padding="10dp">
  10.  
  11.     <TextView
  12.         android:id="@+id/txtIco"
  13.         android:layout_width="wrap_content"
  14.         android:layout_height="wrap_content"
  15.         android:layout_gravity="center_horizontal"
  16.         android:layout_marginBottom="10dp"
  17.         android:text="图标"
  18.         android:textColor="@color/black"
  19.         android:textSize="36dp" />
  20.  
  21.     <TextView
  22.         android:id="@+id/txtName"
  23.         android:layout_width="wrap_content"
  24.         android:layout_height="wrap_content"
  25.         android:layout_gravity="center_horizontal"
  26.         android:text="名称" />
  27. </LinearLayout>

关键设置 

GridView

android:layout_centerInParent="true"
android:numColumns="3"
android:stretchMode="columnWidth"

内部Item

android:layout_columnWeight="1"
android:gravity="center"
android:orientation="vertical"

2.后置文件 MainActivity.java

  1. package com.qingshanblog;
  2.  
  3. import android.content.Intent;
  4. import android.os.Bundle;
  5. import android.view.View;
  6. import android.view.ViewGroup;
  7. import android.widget.BaseAdapter;
  8. import android.widget.GridView;
  9. import android.widget.LinearLayout;
  10. import android.widget.TextView;
  11. import android.widget.Toast;
  12.  
  13. import androidx.appcompat.app.ActionBar;
  14.  
  15. public class MainActivity extends BaseActivity {
  16.  
  17.     GridView gridView;
  18.     public int[] menu = new int[]{R.string.menu_blog, R.string.menu_qrlogin, R.string.menu_location, R.string.menu_scan, R.string.menu_camera, R.string.menu_config};
  19.     public int[] ico = new int[]{R.string.fa_blog, R.string.fa_unlock, R.string.fa_location, R.string.fa_qr, R.string.fa_camera, R.string.fa_config};
  20.  
  21.     @Override
  22.     protected void onCreate(Bundle savedInstanceState) {
  23.         super.onCreate(savedInstanceState);
  24.         setContentView(R.layout.activity_main);
  25.  
  26.         //不显示标题
  27.         ActionBar actionBar = getSupportActionBar();
  28.         if (actionBar != null) {
  29.             actionBar.hide();
  30.         }
  31.         SetStatusBarTransparent();//状态栏透明
  32.         SetStatusBarTextColor(true);//状态栏文字变黑
  33.  
  34.         gridView = (GridView) findViewById(R.id.gridView);
  35.         MenuAdapter adapter = new MenuAdapter();
  36.         gridView.setAdapter(adapter);
  37.     }
  38.  
  39.  
  40.     public class MenuAdapter extends BaseAdapter {
  41.  
  42.         @Override
  43.         public int getCount() {
  44.             return menu.length;
  45.         }
  46.  
  47.         @Override
  48.         public Object getItem(int i) {
  49.             return null;
  50.         }
  51.  
  52.         @Override
  53.         public long getItemId(int i) {
  54.             return 0;
  55.         }
  56.  
  57.         @Override
  58.         public View getView(final int i, View view, ViewGroup viewGroup) {
  59.             View view1 = View.inflate(MainActivity.this, R.layout.activity_main_menu_item, null);
  60.  
  61.             //单个按钮布局
  62.             LinearLayout layout = (LinearLayout) view1.findViewById(R.id.layMenu);
  63.             layout.setTag(menu[i]);
  64.             layout.setOnClickListener(view2 -> {
  65.                 LinearLayout txt = (LinearLayout) view2;
  66.                 int name = (int) txt.getTag();
  67.                 Intent t;
  68.                 switch (name) {
  69.                     case R.string.menu_blog:
  70.                         t = new Intent(MainActivity.this, BlogActivity.class);
  71.                         startActivity(t);
  72.                         break;
  73.                     case R.string.menu_qrlogin: 
  74.                         break;
  75.                     case R.string.menu_location:
  76.                         t = new Intent(MainActivity.this, LocationActivity.class);
  77.                         startActivity(t);
  78.                         break;
  79.                     case R.string.menu_scan:
  80.                         t = new Intent(MainActivity.this, ScanActivity.class);
  81.                         startActivity(t);
  82.                         break;
  83.                     case R.string.menu_camera:
  84.                         t = new Intent(MainActivity.this, CameraActivity.class);
  85.                         startActivity(t);
  86.                         break;
  87.                     case R.string.menu_config:
  88.                         t = new Intent(MainActivity.this, ConfigActivity.class);
  89.                         startActivity(t);
  90.                         break; 
  91.                     default:
  92.                         Toast toast = Toast.makeText(MainActivity.this, name, Toast.LENGTH_SHORT);
  93.                         toast.show();
  94.                         break;
  95.                 }
  96.             });
  97.  
  98.             //设置图标
  99.             TextView txtIco = view1.findViewById(R.id.txtIco);
  100.             txtIco.setTypeface(AppContext._font);
  101.             txtIco.setText(ico[i]);
  102.  
  103.             //设置菜单
  104.             TextView txtName = view1.findViewById(R.id.txtName);
  105.             txtName.setText(menu[i]); 
  106.             return view1;
  107.  
  108.         }
  109.  
  110.     }
  111.  
  112. }
BaseActivity.java 主要就2个方法，用来隐藏顶部状态栏，如果不需要，则可以不用。
  1. package com.qingshanblog;
  2.  
  3. import android.os.Build;
  4. import android.view.View;
  5. import android.view.WindowManager;
  6.  
  7. import androidx.appcompat.app.AppCompatActivity;
  8.  
  9. public class BaseActivity extends AppCompatActivity {
  10.  
  11.     //设置状态栏字体为黑色
  12.     protected void SetStatusBarTextColor(boolean isBlack) {
  13.         if (Build.VERSION.SDK_INT > Build.VERSION_CODES.M) {
  14.             if (isBlack) {
  15.                 getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR);//设置状态栏黑色字体
  16.             } else {
  17.                 getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);//恢复状态栏白色字体
  18.             }
  19.         }
  20.     }
  21.  
  22.     //设置半透明状态栏
  23.     protected void SetStatusBarTransparent() {
  24.         if (Build.VERSION.SDK_INT >= 21) {//21表示5.0
  25.             View decorView = getWindow().getDecorView();
  26.             int option = View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN | View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
  27.             decorView.setSystemUiVisibility(option);
  28.             getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
  29.         } else if (Build.VERSION.SDK_INT >= 19) {//19表示4.4
  30.             getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
  31.             //虚拟键盘也透明
  32.             //getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
  33.         }
  34.     }
  35. }

3.用到的资源文件 string.xml

  1. <resources>
  2.     <string name="app_name">清山博客</string>
  3.     <!--九宫格导航菜单-->
  4.     <string name="menu_blog">清山博客</string>
  5.     <string name="menu_qrlogin">扫码登录</string>
  6.     <string name="menu_location">定位示例</string>
  7.     <string name="menu_scan">扫描识别</string>
  8.     <string name="menu_camera">拍照上传</string>
  9.     <string name="menu_config">参数配置</string>
  10.  
  11.     <!--参考:http://www.htmleaf.com/ziliaoku/font-awesome/font-awesome-4-4-0.html-->
  12.     <string name="fa_users">&#xf0c0;</string>
  13.     <string name="fa_blog">&#xf268;</string>
  14.     <string name="fa_qr">&#xf06e;</string>
  15.     <string name="fa_location">&#xf124;</string>
  16.     <string name="fa_unlock">&#xf108;</string>
  17.     <string name="fa_camera">&#xf030;</string>
  18.     <string name="fa_config">&#xf013;</string>
  19.  
  20. </resources>

文件目录结构

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/小惠珠哦/article/detail/949517
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号