根据接口动态修改应用底部菜单栏

前言

咱们都知道在京东,淘宝这些App,在节假日,好比双11,春节之类的,都会显示不一样的底部菜单栏,那这种是怎么实现的呢?
我有2个思路:php

  • 直接推热更,把打包好的补丁推上去,不过这种成本比较高,并且产品经理还不必定答应这么作。
  • 后台提供接口,在进入页面的时候获取图片List,本地缓存,由接口提供的flag进行控制是否显示这种特殊的菜单栏。

这边使用的是第二种方法。java

实现

这边先看下我这边的页面布局:

页面布局
页面布局

总体的布局大概为:android

总体的布局大概
总体的布局大概

一个vertical的LinearLayout里面放置了一个ViewPager以及一个RadioGroup,RadioGroup做为底部的菜单控件,RadioButton做为菜单选项。

<RadioGroup
        android:id="@+id/rdoG_main_menu"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/rdoBtn_main_index"
            style="@style/base_radio_button"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:drawableTop="@drawable/sl_main_index"
            android:text="@string/text_index"/>

        <RadioButton
            android:id="@+id/rdoBtn_main_game"
            style="@style/base_radio_button"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:drawableTop="@drawable/sl_main_game"
            android:text="@string/text_game"/>

        <RadioButton
            android:id="@+id/rdoBtn_main_trad"
            style="@style/base_radio_button"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:drawableTop="@drawable/sl_main_trad"
            android:text="@string/text_trad"/>

        <RadioButton
            android:id="@+id/rdoBtn_main_center"
            style="@style/base_radio_button"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:drawableTop="@drawable/sl_main_personal"
            android:text="@string/text_person"/>
    </RadioGroup>复制代码

以前的菜单图标

以前的菜单图标是用静态的资源文件,也就是R.mipmap.xxxx图片资源,再经过Selector来控制图标切换:sql

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="false" android:drawable="@mipmap/personal_normal"/>
    <item android:state_checked="true" android:drawable="@mipmap/personal_selected"/>
</selector>复制代码

那问题来了,图标是从网上下载的,selector是xml写的,那咱们要怎么办呢?
若是selector能够用java来写
若是网络图片能够存为本地图片(下次使用)
那就天下太平,一见生财了!缓存

解决

java代码生成selector

经过java代码动态生成selector网络

/** * 建立Selector背景资源文件 * * @param context * @param checked 确认时候的资源文件 * @param unchecked 非确认时候的资源文件 * @return */
    private StateListDrawable createDrawableSelector(Context context, Drawable unchecked, Drawable checked) {
        StateListDrawable stateList = new StateListDrawable();
        int statePressed = android.R.attr.state_pressed;
        int stateChecked = android.R.attr.state_checked;
        int stateFocused = android.R.attr.state_focused;
        stateList.addState(new int[]{stateChecked}, checked);
        stateList.addState(new int[]{statePressed}, checked);
        stateList.addState(new int[]{stateFocused}, checked);
        stateList.addState(new int[]{}, unchecked);
        return stateList;
    }复制代码

根据生成的Selector给radioButton设置drawableTopapp

/** * 根据bitmap位图文件生成selector * * @param bitmapDefault * @param bitmapChecked */

    private void createButtonSelector(Bitmap bitmapDefault, Bitmap bitmapChecked, RadioButton radioButton) {
        BitmapDrawable drawableDefault = new BitmapDrawable(bitmapDefault);
        BitmapDrawable drawableChecked = new BitmapDrawable(bitmapChecked);
        Drawable drawable = createDrawableSelector(this, drawableDefault, drawableChecked);
        drawable.setBounds(0, 0, ICON_WIDTH,
                ICON_WIDTH);
        radioButton.setCompoundDrawables(null, drawable, null, null);
    }复制代码

查看如何使用ide

createButtonSelector(BitmapFactory.decodeResource(getResources(), R.mipmap.trad_normal),
                BitmapFactory.decodeResource(getResources(), R.mipmap.trad_selected), mRdoBtnMainTrad);复制代码

其中 trad_normal以及trad_selected为mipmap中的图片资源;mRdoBtnMainTrad为所要设置的RadioButton。布局

Ok,到这里为止,java代码生成selector而且设置已经完成了。ui

从网络上获取图片资源

单单获取bitmap

若是咱们只是须要单单获取bitmap,那么咱们能够调用Drawable的方法:

/** * 从网络获取图片 * * @param clazz 调用方法的类 * @param netUrl 获取图片的连接 * @return 返回一个 drawable 类型的图片 */
    private static Drawable loadImageFromNet(Class clazz, String netUrl) {
        Drawable drawable = null;
        try {
            drawable = Drawable.createFromStream(new URL(netUrl).openStream(), "netUrl.jpg");
        } catch (IOException e) {
            XLog.e(clazz.getName() + e.getMessage());
        }

        return drawable;
    }复制代码

可是!!这样是很差的,若是单单这样作的话,那咱们每次都须要从网络获取资源,再从新生成selector,再设置上去,这样的消耗太大了,至少,图片咱们须要缓存起来!
这里咱们使用了Glide来作图片下载,固然,其余的毕卡索或者imageloader也都是有相似的方法的:

/** * 保存图片到手机 * * @param url */
    public static void download(final String url) {
        new AsyncTask<Void, Integer, File>() {
            @Override
            protected File doInBackground(Void... params) {
                File file = null;
                try {
                    FutureTarget<File> future = Glide
                            .with(CatApplication.getInstance())
                            .load(url)
                            .downloadOnly(Target.SIZE_ORIGINAL, Target.SIZE_ORIGINAL);
                    file = future.get();
                    // 首先保存图片
                    File pictureFolder = Environment.getExternalStoragePublicDirectory(Environment.DIRECTORY_PICTURES).getAbsoluteFile();
                    File appDir = new File(pictureFolder, AppConf.DownLoadConf.DOWNLOAD_DIR);
                    if (!appDir.exists()) {
                        appDir.mkdirs();
                    }
                    String fileName = System.currentTimeMillis() + ".jpg";
                    File destFile = new File(appDir, fileName);
                    Kits.File.copyFile(file.getPath(), destFile.getPath());
                    XLog.e(destFile.getAbsolutePath());
                } catch (Exception e) {
                    e.printStackTrace();
                }
                return file;
            }

            @Override
            protected void onPostExecute(File file) {
            }

            @Override
            protected void onProgressUpdate(Integer... values) {
                super.onProgressUpdate(values);
            }
        }.execute();
    }复制代码

其中copyFile的方法为:

/** * copy file * * @param sourceFilePath * @param destFilePath * @return * @throws RuntimeException if an error occurs while operator FileOutputStream */
        public static boolean copyFile(String sourceFilePath, String destFilePath) {
            InputStream inputStream = null;
            try {
                inputStream = new FileInputStream(sourceFilePath);
            } catch (FileNotFoundException e) {
                throw new RuntimeException("FileNotFoundException occurred. ", e);
            }
            return writeFile(destFilePath, inputStream);
        }复制代码
/** * write file, the bytes will be written to the begin of the file * * @param filePath * @param stream * @return * @see {@link #writeFile(String, InputStream, boolean)} */
        public static boolean writeFile(String filePath, InputStream stream) {
            return writeFile(filePath, stream, false);
        }复制代码
/** * write file * * @param stream the input stream * @param append if <code>true</code>, then bytes will be written to the end of the file rather than the beginning * @return return true * @throws RuntimeException if an error occurs while operator FileOutputStream */
        public static boolean writeFile(String filePath, InputStream stream, boolean append) {
            return writeFile(filePath != null ? new java.io.File(filePath) : null, stream, append);
        }复制代码
/** * write file * * @param file the file to be opened for writing. * @param stream the input stream * @param append if <code>true</code>, then bytes will be written to the end of the file rather than the beginning * @return return true * @throws RuntimeException if an error occurs while operator FileOutputStream */
        public static boolean writeFile(java.io.File file, InputStream stream, boolean append) {
            OutputStream o = null;
            try {
                makeDirs(file.getAbsolutePath());
                o = new FileOutputStream(file, append);
                byte data[] = new byte[1024];
                int length = -1;
                while ((length = stream.read(data)) != -1) {
                    o.write(data, 0, length);
                }
                o.flush();
                return true;
            } catch (FileNotFoundException e) {
                throw new RuntimeException("FileNotFoundException occurred. ", e);
            } catch (IOException e) {
                throw new RuntimeException("IOException occurred. ", e);
            } finally {
                IO.close(o);
                IO.close(stream);
            }
        }复制代码
/** * Creates the directory named by the trailing filename of this file, including the complete directory path required * to create this directory. <br/> * <br/> * <ul> * <strong>Attentions:</strong> * <li>makeDirs("C:\\Users\\Trinea") can only create users folder</li> * <li>makeFolder("C:\\Users\\Trinea\\") can create Trinea folder</li> * </ul> * * @param filePath * @return true if the necessary directories have been created or the target directory already exists, false one of * the directories can not be created. * <ul> * <li>if {@link File#getFolderName(String)} return null, return false</li> * <li>if target directory already exists, return true</li> * </ul> */
        public static boolean makeDirs(String filePath) {
            String folderName = getFolderName(filePath);
            if (TextUtils.isEmpty(folderName)) {
                return false;
            }

            java.io.File folder = new java.io.File(folderName);
            return (folder.exists() && folder.isDirectory()) || folder.mkdirs();
        }复制代码

固然,眼尖的同窗会发现:
这里有问题啊---->

String fileName = System.currentTimeMillis() + ".jpg";复制代码

图片的命名是没规则的,那咱们怎么从获取的图片中找到本身要的,而后对应生成selector呢?
这里博主的思路是创建一个sql,创建一个映射,不过如今后台还没开发出接口,等接好后,博主会放出一个demo。

总结

以上是博主本身的思路想法,若是各位大佬有更好的方法,欢迎私信以及留言。

以上 互勉

相关文章
相关标签/搜索