mardi 14 août 2018

Improving user experience with toggling on/off over 300 CheckBoxes

I made a simple cooking app where user can select multiple items and get a list of recipes with selected ingredients. There are 2 modes of selecting the ingredients: by tags and by checkboxes. In the second mode you can enter the number of ingredients you wish and hit the button "randomize" or just press "Select/Deselect all ingredients" buttons. The problem started with the number of checkboxes over 300 (386, to be specific). Code is working fine, but the time of GUI remain frozen is too big.

So, I've got HashMap <String/CheckBox> checkBoxHashMap, where key is tag of the check box. To select all (same for deselect all, but with false value) I am using this code:

for (CheckBox chkBox: checkBoxHashMap.values()) {
        chkBox.setChecked(true);
    }

What I tried to use: 1) Using ProgressBar. The problem was, that animation of ProgressBar is frozen during the selection/deselection of all CheckBoxes. Plus, most of the times ProgressBar even didn't showed up (I hid the ProgressBar after all the CheckBoxes were selected; 2) Using chkBox.jumpDrawablesToCurrentState(); right after calling chkBox.setChecked(true); and it was the best I could acquire in performance, but still it lagged and didn't satisfied me.

What I want: I want to make it more user friendly (frozen GUI is not user friendly at all, I believe). I want to implement soft toggling on/off all the CheckBoxes (chain-like animation) or something else like disabling animation and enabling it back after all the CheckBoxes have changed their state and redrawing them all together.

Is there a way to achieve something like that?




Aucun commentaire:

Enregistrer un commentaire