Темы оформления. С блэк-джеком и WeakReference

Как-то раз передо мной встала задача сделать в приложении на Android поддержку тем оформления. Что хотелось получить:

1. Возможность переключить оформление — изменить некоторые цвета и графику
2. Смена должна происходить “на лету”, для пользователя должно измениться только оформление, все остальное (содержание полей ввода, позиция элементов в списке и т.п.) меняться не должно
3. В перспективе хотелось бы, чтобы тема могла изменяться и без участия пользователя, например по времени суток
4. Не хотелось бы в значительной степени изменять уже существующий код или разметку. В идеале хотелось бы просто как-то пометить элементы в разметке
5. Было бы здорово уметь подгружать новые темы без обновления приложения.

О том, чего удалось добиться и как это было реализовано — под катом.

Самый очевидный способ, который наперебой предлагают нам Stack Overflow и документация Android — Context.setTheme. Одна загвоздка — установить тему нужно до создания всех наших View. Сразу понятно, что “на лету” переключить тему не получится, пользователь обязательно заметит полное пересоздание всего содержимого Activity. Да и с кодом каждого Activity так или иначе придется повозиться. Каких-то других рекомендаций в интернетах я так и не нашел (если у кого-то есть информация, буду благодарен за ссылку).

Что ж, напишем свою реализацию. С блэк-джеком и WeakReference.

Будем отталкиваться от пункта 4. Я отношу себя к разработчикам, которые предпочитают не писать код. Я настолько не люблю писать код, что готов написать очень много кода, лишь бы не писать его в будущем. Ничего не могу с собой поделать: не хочу я при появлении очередного окошка продумывать логику взаимодействия таким образом, чтобы учитывать подверженность динамическому изменению оформления. Хочу просто указать в разметке рядом с элементом, что, например, его цвет будет равен цвету фона.

В этом нам поможет свойство tag. Если где-то еще в приложении используются теги, например, в качестве Holder’ов для оптимизации адаптеров в ListView, не страшно. В коде можно использовать setTag/getTag с параметром id. Если таких мест много, поиск и замена нам помогут.

Теперь придумаем какой-то простенький формат для тегов. Во-первых, отделим зерна от плевел и сделаем простейшую проверку на то, что данный тег действительно является указанием к применению наших тем: наш тег всегда будет начинаться с символа “!”. Дальше последует имя ресурса, например “background”. Затем какой-нибудь разделитель, что-то вроде “|”, и тип ресурса — цвет текста, фоновая картинка или фоновый цвет и т.п. Например, фон для окна чата с использованием тайлинга: “!chat|tiled_bg”. Может быть, не слишком эстетично, зато быстро парсить. Чтобы делать минимум ошибок при написании таких тегов, лучше вынести их в строковые ресурсы и переиспользовать — в нашем приложении ресурс !primary|text_fg используется 77 раз.

Самое сложное позади, осталось только как-то эти теги обработать… Элементы с такими тегами надо обрабатывать сразу при “надувании” (inflate) View, а затем при каждой смене темы. “Надувание” происходит фактически двумя способами — setContentView в Activity и с помощью LayoutInflater. Начнем с setContentView.

В нашем приложении все Activity наследуются от небольшого числа базовых Activity. Достаточно переопределить метод setContentView:

    public void setContentView(int id) {
        super.setContentView(id);
        HotTheme.manage(mActivity.getWindow().getDecorView());
    }

Метод getDecorView вернет нам “корень” иерархии View.
Чтобы сделать то же самое при создании View с помощью LayoutInflater, обернем его:

public class HotLayoutInflater {

    private LayoutInflater inflater;

    private HotLayoutInflater(LayoutInflater inflater) {
        this.inflater = inflater;
    }

    public View inflate(int resource, ViewGroup root, boolean attachToRoot) {
        View v = inflater.inflate(resource, root, attachToRoot);
        HotTheme.manage(v);
        return v;
    }

    public View inflate(int resource, ViewGroup root) {
        View v = inflater.inflate(resource, root);
        HotTheme.manage(v);
        return v;
    }

    public static HotLayoutInflater wrap(LayoutInflater layoutInflater) {
        return new HotLayoutInflater(layoutInflater);
    }

    public static HotLayoutInflater from(Context context) {
        return new HotLayoutInflater(LayoutInflater.from(context));
    }

}

Теперь — разбор иерархии View:

HotTheme.java:

    public static void manage(View... views) {
        for (View v : views) {
            simpleManage(v);
            if (v instanceof ViewGroup) {
                ViewGroup vg = (ViewGroup) v;
                for (int i = 0; i < vg.getChildCount(); i++) {
                    manage(vg.getChildAt(i));
                }
            }
        }
    }

    public static void simpleManage(View view) {
        Object t = view.getTag();
        if (t instanceof String) {
            String tag = (String) t;
            if (tag.startsWith("!")) {
                tag = tag.substring(1);
                String[] elements = tag.split("\|");
                String base = elements[0];
                for (int i = elements.length - 1; i >= 1; i--) {
                    ThemedView tv = createThemedView(view, base, elements[i]);
                    tv.notifyChange();
                    HotTheme.sViews.add(tv);
                }
            }
        }
    }

Как видно, из иерархии выдергиваются те View, что содержат наш тег. На всякий случай считаем, что разделителей “|” может быть несколько — тогда ресурс будет применен к каждому типу (это может оказаться полезным).

Далее эти элементы оборачиваются в некий ThemedView, который и отвечает за всю магию. Метод notifyChange применит текущую тему к данному View. Ну и сохраним ThemedView на будущее для нотификации о смене тем — ничего сложного.
Сам класс ThemedView представляет собой простейшую обертку над View, предотвращающую утечку контекста:

private static abstract class ThemedView {

    private WeakReference<View> view;

    ThemedView(View v) {
        view = new WeakReference<View>(v);
    }

    boolean notifyChange() {
        View v = view.get();
        if (v == null) {
            return false;
        }
        onChange(v);
        return true;
    }

    abstract void onChange(View v);

    @Override
    public boolean equals(Object o) {
        if (this == o) {
            return true;
        }
        if (o == null || getClass() != o.getClass()) {
            return false;
        }

        ThemedView view1 = (ThemedView) o;

        View v1 = view.get();
        View v2 = view1.view.get();

        return (v1 != null ? v1.equals(v2) : v2 == null);

    }

    @Override
    public int hashCode() {
        if (view == null) {
            return 0;
        }
        View v = view.get();
        return v != null ? v.hashCode() : 0;
    }
}

Теперь при смене темы для ее применения ко всем заинтересованным View достаточно вызвать:

    for (Iterator<ThemedView> it = views.iterator(); it.hasNext(); ) {
        if (!it.next().notifyChange()) {
            it.remove();
        }
    }

Вернемся к нашему ThemedView, в наследниках которого в методе onChange мы определяем, что именно происходит с View:

    private static ThemedView createThemedView(View v, final String base, String element) {
        ThemeType type = types.get(element);

        switch (type) {
        case TILED_BG:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    Bitmap bmp = decodeBitmap(base + "_bg");
                    BitmapDrawable bd = new BitmapDrawable(app().getResources(), bmp);
                    bd.setTileModeXY(Shader.TileMode.REPEAT, Shader.TileMode.REPEAT);
                    v.setBackgroundDrawable(bd);
                }
            };
        case VIEW_COLOR_BG:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    int color = getColor(base + "_bg");
                    v.setBackgroundColor(color);
                    if (v instanceof ListView) {
                        // There is an android bug in setCacheColorHint
                        // That caused the IndexOutOfBoundsException
                        // look here:
                        // http://code.google.com/p/android/issues/detail?id=12840
                        //
                        // Moreover, that bug doesn't allow us to setDrawableCacheColor
                        // for recycled views. That's why we need to perform cleaning up
                        // via reflections
                        //
                        // Fixed in android 4.1.1_r1
                        try {
                            ((ListView) v).setCacheColorHint(color);
                        } catch (IndexOutOfBoundsException ex) {
                            try {
                                Field mRecycler = AbsListView.class.getDeclaredField("mRecycler");
                                mRecycler.setAccessible(true);
                                Object recycler = mRecycler.get(v);
                                Method m = recycler.getClass().getDeclaredMethod("clear");
                                m.setAccessible(true);
                                m.invoke(recycler);
                            } catch (Throwable t) {
                                // No need to report this

                            }
                        }
                    }
                }
            };
        case VIEW_IMAGE_BG:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    v.setBackgroundDrawable(decodeDrawable(base + "_bg"));
                }
            };
        case IMAGE_FG:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    ((ImageView) v).setImageDrawable(decodeDrawable(base + "_bg"));
                }
            };
        case TEXT_COLOR:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    final int color = getColor(base + "_fg");
                    if (v instanceof TextView) {
                        ((TextView) v).setTextColor(color);
                    }
                }
            };
        case TEXT_HINT:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    final int color = getColor(base + "_hint_fg");
                    if (v instanceof TextView) {
                        ((TextView) v).setHintTextColor(color);
                    }
                }
            };
        case PAGER:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    int active = getColor(base + "_active_fg");
                    int inactive = getColor(base + "_inactive_fg");
                    int footer = getColor(base + "_footer_bg");

                    TitlePageIndicator pager = (TitlePageIndicator) v;
                    pager.setSelectedColor(active);
                    pager.setTextColor(inactive);
                    pager.setFooterColor(footer);
                }
            };
        case DIVIDER:
            return new ThemedView(v) {
                @Override
                public void onChange(View v) {
                    int color = getColor(base + "_divider");
                    ListView lv = (ListView) v;
                    int h = lv.getDividerHeight();
                    lv.setDivider(new ColorDrawable(color));
                    lv.setDividerHeight(h);
                }
            };
        case TABBUTTON_BG:
            return new ThemedView(v) {
                @Override
                void onChange(View v) {
                    StateListDrawable stateDrawable = new StateListDrawable();

                    Drawable selectedBd = decodeDrawable(base + "_selected");

                    stateDrawable.addState(new int[]{android.R.attr.state_selected}, selectedBd);
                    stateDrawable.addState(new int[]{android.R.attr.state_pressed}, selectedBd);
                    stateDrawable.addState(new int[]{}, decodeDrawable(base + "_unselected"));
                    v.setBackgroundDrawable(stateDrawable);
                }
            };
        case EDITTEXT_COLOR:
            return new ThemedView(v) {
                @Override
                void onChange(View v) {
                    int color = getColor(base + "_fg");
                    EditText edit = (EditText) v;
                    edit.setTextColor(color);
                    int hintColor = getColor(base + "_disabled_fg");
                    edit.setHintTextColor(hintColor);
                }
            };
        case GROUP_TINT:
            return new ThemedView(v) {
                @Override
                void onChange(View v) {
                    int tintColor = getColor(base + "_fg");
                    ImageView imageView = (ImageView) v;
                    imageView.setColorFilter(tintColor, PorterDuff.Mode.SRC_ATOP);
                }
            };
        default:
            throw new IllegalArgumentException("Error in layout: no such type "" + element + "" (" + base + ")");
        }
    }

Код types.get(element) просто возвращает enum по строке в нижнем регистре.

Из интересного остались методы decodeBitmap, decodeDrawable и getColor:

    private static ResourceInfo findResource(String base, ResourceType type) {
        return sCurrentProvider.findResource(base, type);
    }

    public static Drawable decodeDrawable(String base) {
        ResourceInfo info = findResource(base, ResourceType.Drawable);
        return info.getResources().getDrawable(info.getResId());
    }

    public static Bitmap decodeBitmap(String base) {
        ResourceInfo info = findResource(base, ResourceType.Drawable);
        return BitmapFactory.decodeResource(info.getResources(), info.getResId(), Util.newPurgeableBitmapOptions());
    }

    public static int getColor(String base) {
        ResourceInfo info = findResource(base, ResourceType.Color);
        return info.getResources().getColor(info.getResId());
    }

В качестве sCurrentProvider выступает объект класса ThemeProvider, единственной задачей которого является получение информации ресурса по его имени и типу.
Простейшая реализация будет добавлять в качестве префикса к имени ресурса некоторый ID темы:

    @Override
    public ResourceInfo findResource(String name, ResourceType type) {
        int id = IdUtils.getResId(app().getResources(),
                mPrefix + "_" + name, type.getType(), PACKAGE_NAME);
        if (id == 0 && mNext != null) {
            return mNext.findResource(name, type);
        }
        return new ResourceInfo(app().getResources(), id);
    }

Метод getResId является небольшой оберткой над методом Resources.getIdentifier.
Поле mNext также является объектом ThemeProvider. Он нужен для того, чтобы производить поиск по цепочке, если ресурс не был найден (в конечном итоге будет взят дефолтный).

В итоге для того, чтобы сделать очередную тему, нужно просто добавить набор необходимых ресурсов, добавив какой-нибудь префикс. Например, названия ресурсов для фона окна чата:
def_chat_bg
night_chat_bg
pink_chat_bg
wood_chat_bg

Итого

Как было сказано в начале, было бы здорово уметь подгружать ресурсы не только из самого приложения, но и извне. Источником может служить, например, другое приложение. В этом случае все будет работать так же, за исключением имени пакета и объекта Resources. Его, в свою очередь, можно получить через PackageManager.getResourcesForApplication.

Вспомним еще раз, чего мы хотели добиться:

1. Возможность переключить оформление — готово
2. Смена должна происходить “на лету” — готово
3. В перспективе хотелось бы, чтобы тема могла изменяться и без участия пользователя — перспектива проглядывается, препятствий нет
4. Не хотелось бы в значительной степени изменять уже существующий код или разметку — кода, на самом деле, поменялось довольно много, но, в основном, с помощью поиска и замены, так что здесь тоже можно поставить плюс
5. Подгружать новые темы без обновления приложения — готово, ресурсы могут подгружаться из любых apk

Похоже, все получилось. Спасибо всем, кто осилил статью до конца. Надеюсь, кто-то воспользуется описанным приемом для того, чтобы придать своему приложению возможностью подстраиваться под настроение пользователей — поверьте, они скажут вам спасибо!

P.S.: ну и, как полагается, минутка рекламы — приложение Агента с темами здесь.

Автор: Artyomcool

Источник