summaryrefslogtreecommitdiff
path: root/pages/develop/legacy/tutorial/basic/button.txt
blob: a12c90c66f79074cf92d15357c398fb1df79331a (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
==== Button ====

=== Button styles ===

//**__Basic text button__**//

As seen in [[develop/efl/start|Get started with EFL]] tutorial, a text-only
button is created as follows:

<code c>
    //basic text button
    Evas_Object *button_text;
    button_text = elm_button_add(win);

    elm_object_text_set(button_text,"Clik me");

    //how a container object should resize a given child within its area
    evas_object_size_hint_weight_set(button_text, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
    //how to align an object
    evas_object_size_hint_align_set(button_text, EVAS_HINT_FILL, 0.5);

    //100x30 px button
    evas_object_resize(button_text, 100, 30);
    evas_object_show(button_text);
</code>

//**__Basic icon button__**//

Instead of a button having only some text, you can also opt to having an
icon-only button.

<code c>
    //Basic icon button
    Evas_Object *button_icon, *icon;
    button_icon = elm_button_add(win);
    icon = elm_icon_add(win);

    //set the image file and the button as an icon
    elm_image_file_set(icon, "icon.png", NULL);
    elm_object_part_content_set(button_icon, "icon", icon);

    evas_object_size_hint_weight_set(button_icon, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
    evas_object_size_hint_align_set(button_icon, EVAS_HINT_FILL, 0.5);

    //100x30 px button
    evas_object_resize(button_icon, 100, 30);
    evas_object_move(button_icon, 110, 0);
    evas_object_show(button_icon);
</code>

The function ''elm_object_part_content_set(button_icon, "icon",icon)'' sets
the content on part on a given container widget. All widgets
deriving from the Elementary Container Class may match. This sets new content
to a given part. If any object was already set as a content object, it will be
deleted.

//**__Icon and text button__**//

You can also have buttons holding both an icon and a label.

<code c>
    //Icon and text button
    Evas_Object *button_icon_text, *icon2;
    button_icon_text = elm_button_add(win);
    icon2 = elm_icon_add(win);

    elm_image_file_set(icon2, "icon.png", NULL);
    elm_object_part_content_set(button_icon_text, "icon", icon2);
    elm_object_text_set(button_icon_text, "Press me");
    evas_object_size_hint_weight_set(button_icon_text, EVAS_HINT_EXPAND, EVAS_HINT_EXPAND);
    evas_object_size_hint_align_set(button_icon_text, EVAS_HINT_FILL, 0.5);

    evas_object_resize(button_icon_text, 100, 30);
    evas_object_move(button_icon_text, 220, 0);
    evas_object_show(button_icon_text);
</code>

//**__Disabled button__**//

If you want to disable your button but still visible:

<code c>
elm_object_disabled_set(button, EINA_TRUE);
</code>

== Callbacks ==

Elementary buttons respond to user interactions thanks to several events.

//**__Click event__**//

The “click” event is the most basic and well-known one. The following code
snippet will change the text of a button upon a click event: a press followed
by an unpress.

<code c>
//Click Callback: print Clicked
static void
_button_click_cb(void *data, Evas_Object *button, void *event_info){
    elm_object_text_set(button, "Clicked!");
}

evas_object_smart_callback_add(button_text, "clicked", button_click_cb, NULL);
</code>

//**__Press/unpress events __**//

The button can also respond to the press and unpress events instead of the
whole click.

<code c>
//Press callback: print Pressed
static void
_button_press_cb(void * data, Evas_Object *button, void *event_info){
    elm_object_text_set(button, "Pressed!");
}

//Unpress callback: print Unpressed
static void
_button_unpress_cb(void *data, Evas_Object *button, void *event_info){
    elm_object_text_set(button, "Unpressed!");
}

evas_object_smart_callback_add(button_icon, "pressed", _button_press_cb, NULL);
evas_object_smart_callback_add(button_icon, "unpressed", _button_unpress_cb, NULL);
</code>

//**__Repeated events__**//

The button can also receive several events in case it is being held by the
user. Timings such as the initial timeout and the repeat interval can be set.
In this example, the initial timeout is set to one second, and the repeat
interval to half a second.

<code c>
static void
_button_repeat_cb(void *data, Evas_Object *button, void *event_info){
    static int count = 0;
    char buffer[16];

    snprintf(buffer, sizeof(buffer), "Repeat %d", count++);

    //print the number of time callback was called
    elm_object_text_set(button, buffer);
}

    //Get whether the autorepeat feature is enabled.
    elm_button_autorepeat_set(button_icon_text, EINA_TRUE);
    //Set the initial timeout before the autorepeat event is generated.
    elm_button_autorepeat_initial_timeout_set(button_icon_text, 1.0);
    //gap between two callbacks
    elm_button_autorepeat_gap_timeout_set(button_icon_text, 0.5);
    //"repeated": the user pressed the button without releasing it.
    evas_object_smart_callback_add(button_icon_text, "repeated", _button_repeat_cb, NULL);
</code>

//**__Focused/unfocused events__**//

The event Focused is equivalent to click indeed callback is called when you
are "focused" on the button. So, you are unfocused when you are not focused on
the first button. For having two buttons, a box container will be needed.

The button can also receive event from another button in case it is being
focused when you click on it and unfocused when you press and unpress another
one.

<code c>
static void
_button_focused_cb(void * data, Evas_Object *button, void *event_info){
    elm_object_text_set(button, "Focused");
}

static void
_button_unfocused_cb(void * data, Evas_Object *button, void *event_info){
    elm_object_text_set(button, "Unfocused");
}
    //Focused/unfocused event
    Evas_Object *button;

    button = elm_button_add(win);
    elm_object_text_set(button, "button");
    evas_object_resize(button, 100, 30);
    evas_object_move(button, 0, 40);
    evas_object_show(button);

    evas_object_smart_callback_add(button, "focused", _button_focused_cb, NULL);
    evas_object_smart_callback_add(button, "unfocused", _button_unfocused_cb, NULL);
</code>
\\
**//The whole code://** {{code_c/tutorial/basic/button.c}}

==== Next Part ====

//**__[[/develop/legacy/tutorial/basic/label]]__**//