语言

Menu
Sites
Language
How to show the soft keyboard without layout's crawling up

Hi all,

My application's screen has an entry, buttons, and a list.

When the entry is activated, the layout crawls up a little.

Since my buttons are laid on top, it is difficult to click those.

I want to know how to show the soft keyboard without crawling up.

Thank you.

响应

2 回复
woochan lee

hello.

Nomally the layout will be shrinked when keypad activated.

do you want disable this operation?

If so, I recommand you don't do that.

actually the comformant doing this to make show all of the contents.

some of a widget covered with keypad, If comformant not resized.

 

hard to click button after keypad activated? could you please give me a more information what problem you got?

codes, screenshot welcom.

 

 

 

Aneendya Sarker

Hi,
It is natural for the UI to shrink when soft keypad is enabled as woochan lee suggested.
If you do not like it to shrink, then you need to fix the size of the layout so that it doesn't shrink.

But it may cause additional problem, as UI will not be scrollable if it is fixed.
The best way that i know is to create 2 layout.

Create a fixed layout with a scroller, then create another layout within the scroller.
This will allow the inside layout to scroll. You can then add your content into inside layout.

Please refer the below steps if you want to implement this fix.

1. From your description it is unclear, how you created the UI. Did you use EDJ layout files to create the UI layout?

1.1 If not, then the best way to properly manage layout in native Tizen application is to use EDJ layouts.
You may look at below links for reference.

Handling Edje Files:
https://developer.tizen.org/development/ui-practices/native-application/efl/edje-objects/handling-edje-files

Scaling Edje Objects
https://developer.tizen.org/development/ui-practices/native-application/efl/edje-objects/handling-edje-files

1.2 If you are already using EDJ files to create your UI, then you can modify it the following way.

group { name: "main_view";
    parts {
        part {
            name: "bg";
            type: RECT;
            mouse_events: 1;
            scale:1;
            description {
                state: "default" 0.0;
                align:0.0 0.0;
                fixed: 1 1;
                rel1.relative: 0.0 0.0;
                rel2.relative: 1.0 1.0;
                color: 220 220 220 255;
            }
        }
        part {
            name: "bg_layout";
            type: SWALLOW;
            scale: 1;
            description {
                state: "default" 0.0;
                rel1 { relative: 0.0 0.0; to: "bg"; offset: 0 0;}
                rel2 { relative: 1.0 1.0; to: "bg"; offset: 0 0;}
                fixed:1 1;
                align:0.0 0.0;
            }
        }
    }
}
group { name: "content_view";
    parts {
        part {
            name: "bg";
            type: RECT;
            mouse_events: 1;
            scale:1;
            description {
                state: "default" 0.0;
                fixed: 1 1;
                rel1.relative: 0.0 0.0;
                rel2.relative: 1.0 1.0;
                color_class: "AO008";
                color: 220 220 220 255;
            }
        }
        part {
            name: "content_layout";
            type: SWALLOW;
            scale: 1;
            description {
                state: "default" 0.0;
                align: 1.0 0.0;
                rel1 {relative: 0.0 0.0;}
                rel2 {relative: 1 0.0;}
            }
        }
    }
}

2. Create UI screen this way.
2.1. Add a base layout With EDJ in your current naviFrame.

Evas_Object *main_layout = elm_layout_add(naviFrame);
elm_layout_file_set(main_layout, "EDJ_PATH", "main_view");
evas_object_size_hint_align_set(main_layout, EVAS_HINT_FILL, EVAS_HINT_FILL);
evas_object_size_hint_weight_set(main_layout, EVAS_HINT_EXPAND, 0.0);

2.2. Add a scroller to the background layout. It will allow the inside layouts to scroll, when soft keypad is active or UI is bigger than the screen.

Evas_Object *scroller = create_scroller(main_layout);
elm_object_part_content_set(main_layout, "bg_layout", scroller);

2.3. Add additional layout inside scroller. This is the layout which will scroll.

Evas_Object *layout = elm_layout_add(scroller);
elm_layout_file_set(layout, "EDJ_PATH", "content_view");
evas_object_size_hint_align_set(layout, EVAS_HINT_FILL, EVAS_HINT_FILL);
evas_object_size_hint_weight_set(layout, EVAS_HINT_EXPAND, 0.0);

2.4. Add a box to hold your content into this layout.

Evas_Object *main_box = elm_box_add(layout);
evas_object_size_hint_weight_set(main_box, EVAS_HINT_EXPAND, 0.0);
evas_object_size_hint_align_set(main_box, EVAS_HINT_FILL, EVAS_HINT_FILL);
elm_box_padding_set(main_box, 0, 30);
elm_object_content_set(layout, main_box);
evas_object_show(main_box);

2.5. Add all content (entry, button, list) inside main_box.

2.6. Add main_box to layout.

elm_object_part_content_set(layout, "content_layout", main_box);
elm_object_content_set(scroller, layout);

2.7. Push main_layout into NaviFrame UI screen.

elm_naviframe_item_push(naviFrame, "Title", NULL, NULL, main_layout, NULL);

This way bg_layout will fill the complete background. And the layout will be able to grow dynamically inside scroller.
When entry is selected, it will press layout, but it not squeeze as it will be inside scroller.

Let me know if it works. It is working for me.
Also let me know if you need any more info or not.