Howto add system-default selection designs to (gen)lists?

Question

I have a nice genlist, and I want to add checkboxes (/toggles) to all items.

I checked these pages:

• https://docs.tizen.org/application/native/guides/ui/efl/wearable/component-genlist/
• https://developer.tizen.org/ko/design/wearable/ui-components/selection-controls?langredirect=1
• https://developer.tizen.org/ko/design/wearable/ui-components/list?langredirect=1

You can provide an on/off switch, checkbox, or radio button along with the main text.

Perfect. How?

I'm aiming to be able to select items from the list, either with something like this:

Or with something like this:

I know I can use item_styles. Also know I can add my own images to swallow.end or similar.

But is there a way to use the same designs as the OS uses? To not break UI consistency?

Answer 1

use elm_check on swallow.end part. I do not know which style do you use, so here is sample with style "1text.1icon.1"

Evas_Object* _gl_icon_get(void *data, Evas_Object *obj, const char *part)
{
        item_data *id = (item_data *)data;
        Evas_Object *content = NULL;

        if (strcmp(part, "elm.icon")) return NULL;

        id->check = content = elm_check_add(obj);
        elm_check_state_set(content, EINA_FALSE);
        elm_check_state_pointer_set(content, &id->checked);
        evas_object_show(content);

        return content;
}

if you want to check state changed when item clicked, call this,

elm_check_state_set(id->check, !id->checked);

in item's selection callback.

you can see the full code in elm-demo-tizen-wearable/src/genlist.c (https://review.tizen.org/gerrit/#/admin/projects/profile/wearable/platform/core/uifw/elm-demo-tizen-wearable, tizen 5.5 branch). hope you now can access review.tizen.org. or you can see the Alarm sample in tizen-studio. but the look of checkbox will be different that you shared image, I think it's because of version differences, Tizen SDK theme is outdated one..