gtk-demo: Misc a11y improvements
authorMatthias Clasen <mclasen@redhat.com>
Sat, 17 Jun 2023 21:54:39 +0000 (17:54 -0400)
committerMatthias Clasen <mclasen@redhat.com>
Sat, 17 Jun 2023 23:29:53 +0000 (19:29 -0400)
demos/gtk-demo/font_features.ui
demos/gtk-demo/fontrendering.ui
demos/gtk-demo/video_player.c

index b498273cc8c9e533893b1631998867a9039f6def..a02fc700332d2d1e2a00cd405a4e6666851d6aeb 100644 (file)
@@ -59,6 +59,9 @@
                     <property name="spacing">6</property>
                     <child>
                       <object class="GtkFontDialogButton" id="font">
+                        <accessibility>
+                          <property name="label">Font</property>
+                        </accessibility>
                         <property name="dialog">
                           <object class="GtkFontDialog">
                           </object>
@@ -73,7 +76,7 @@
                         <property name="column-spacing">10</property>
                         <property name="row-spacing">10</property>
                         <child>
-                          <object class="GtkLabel">
+                          <object class="GtkLabel" id="size_label">
                             <property name="label">Size</property>
                             <property name="xalign">0</property>
                             <property name="valign">baseline</property>
@@ -89,6 +92,9 @@
                             <property name="width-request">100</property>
                             <property name="valign">baseline</property>
                             <property name="adjustment">size_adjustment</property>
+                            <accessibility>
+                              <relation name="labelled-by">size_label</relation>
+                            </accessibility>
                             <layout>
                               <property name="column">1</property>
                               <property name="row">0</property>
                             <property name="max-width-chars">4</property>
                             <property name="hexpand">0</property>
                             <property name="valign">baseline</property>
+                            <accessibility>
+                              <relation name="labelled-by">size_label</relation>
+                            </accessibility>
                             <signal name="activate" handler="basic_entry_activated"
                                     object="size_adjustment" swapped="false"/>
                             <layout>
                           </object>
                         </child>
                         <child>
-                          <object class="GtkLabel">
+                          <object class="GtkLabel" id="letterspacing_label">
                             <property name="label">Letterspacing</property>
                             <property name="xalign">0</property>
                             <property name="valign">baseline</property>
                             <property name="width-request">100</property>
                             <property name="valign">baseline</property>
                             <property name="adjustment">letterspacing_adjustment</property>
+                            <accessibility>
+                              <relation name="labelled-by">letterspacing_label</relation>
+                            </accessibility>
                             <layout>
                               <property name="column">1</property>
                               <property name="row">1</property>
                             <property name="max-width-chars">4</property>
                             <property name="hexpand">0</property>
                             <property name="valign">baseline</property>
+                            <accessibility>
+                              <relation name="labelled-by">letterspacing_label</relation>
+                            </accessibility>
                             <signal name="activate" handler="basic_entry_activated"
                                     object="letterspacing_adjustment" swapped="false"/>
                             <layout>
                           </object>
                         </child>
                         <child>
-                          <object class="GtkLabel">
+                          <object class="GtkLabel" id="line_height_label">
                             <property name="label">Line Height</property>
                             <property name="xalign">0</property>
                             <property name="valign">baseline</property>
                             <property name="width-request">100</property>
                             <property name="valign">baseline</property>
                             <property name="adjustment">line_height_adjustment</property>
+                            <accessibility>
+                              <relation name="labelled-by">line_height_label</relation>
+                            </accessibility>
                             <layout>
                               <property name="column">1</property>
                               <property name="row">2</property>
                             <property name="max-width-chars">4</property>
                             <property name="hexpand">0</property>
                             <property name="valign">baseline</property>
+                            <accessibility>
+                              <relation name="labelled-by">line_height_label</relation>
+                            </accessibility>
                             <signal name="activate" handler="basic_entry_activated"
                                     object="line_height_adjustment" swapped="false"/>
                             <layout>
                           </object>
                         </child>
                         <child>
-                          <object class="GtkLabel">
+                          <object class="GtkLabel" id="foreground_label">
                             <property name="label">Foreground</property>
                             <property name="xalign">0</property>
                             <property name="valign">baseline</property>
                             </property>
                             <property name="valign">baseline</property>
                             <property name="rgba">black</property>
+                            <accessibility>
+                              <relation name="labelled-by">foreground_label</relation>
+                            </accessibility>
                             <signal name="notify::rgba" handler="color_set_cb"/>
                             <layout>
                               <property name="column">1</property>
                           </object>
                         </child>
                         <child>
-                          <object class="GtkLabel">
+                          <object class="GtkLabel" id="background_label">
                             <property name="label">Background</property>
                             <property name="xalign">0</property>
                             <property name="valign">baseline</property>
                             </property>
                             <property name="valign">baseline</property>
                             <property name="rgba">white</property>
+                            <accessibility>
+                              <relation name="labelled-by">background_label</relation>
+                            </accessibility>
                             <signal name="notify::rgba" handler="color_set_cb"/>
                             <layout>
                               <property name="column">1</property>
                             <property name="icon-name">object-flip-vertical-symbolic</property>
                             <property name="halign">start</property>
                             <property name="valign">center</property>
+                            <accessibility>
+                              <property name="label">Swap colors</property>
+                            </accessibility>
                             <style>
                               <class name="circular"/>
                             </style>
                             <property name="yalign">0</property>
                             <property name="valign">start</property>
                             <property name="selectable">1</property>
+                            <accessibility>
+                              <property name="label">Font example</property>
+                            </accessibility>
                           </object>
                         </property>
                       </object>
                         <property name="name">entry</property>
                         <property name="child">
                           <object class="GtkTextView" id="entry">
+                            <accessibility>
+                              <property name="label">Example text</property>
+                            </accessibility>
                             <property name="buffer">
                               <object class="GtkTextBuffer">
                                 <property name="text">Grumpy wizards make toxic brew for the evil Queen and Jack. A quick movement of the enemy will jeopardize six gunboats. The job of waxing linoleum frequently peeves chintzy kids. My girl wove six dozen plaid jackets before she quit. Twelve ziggurats quickly jumped a finch box.
                     <property name="icon-name">document-edit-symbolic</property>
                     <property name="halign">end</property>
                     <property name="valign">end</property>
+                    <accessibility>
+                      <property name="label">Edit text</property>
+                    </accessibility>
                     <signal name="clicked" handler="font_features_toggle_edit"/>
                   </object>
                 </child>
index 8a9d8b06b834dcf2b110f212f9097a51527a2900..1f2fc8569682df74ff6fae8df349ccd895bd0d65 100644 (file)
@@ -39,7 +39,7 @@
             <property name="row-spacing">10</property>
             <property name="column-spacing">10</property>
             <child>
-              <object class="GtkLabel">
+              <object class="GtkLabel" id="text_label">
                 <property name="margin-start">10</property>
                 <property name="label">Text</property>
                 <property name="xalign">1</property>
                 <layout>
                   <property name="column">2</property>
                 </layout>
+                <accessibility>
+                  <relation name="labelled-by">text_label</relation>
+                </accessibility>
               </object>
             </child>
             <child>
-              <object class="GtkLabel">
+              <object class="GtkLabel" id="font_label">
                 <property name="margin-start">10</property>
                 <property name="label">Font</property>
                 <property name="xalign">1</property>
@@ -75,6 +78,9 @@
             </child>
             <child>
               <object class="GtkFontDialogButton" id="font_button">
+                <accessibility>
+                  <relation name="labelled-by">font_label</relation>
+                </accessibility>
                 <property name="dialog">
                   <object class="GtkFontDialog">
                   </object>
                 <property name="icon-name">list-add-symbolic</property>
                 <property name="halign">center</property>
                 <property name="valign">center</property>
+                <accessibility>
+                  <property name="label">Zoom in</property>
+                </accessibility>
                 <style>
                   <class name="circular"/>
                 </style>
                 <property name="icon-name">list-remove-symbolic</property>
                 <property name="halign">center</property>
                 <property name="valign">center</property>
+                <accessibility>
+                  <property name="label">Zoom out</property>
+                </accessibility>
                 <style>
                   <class name="circular"/>
                 </style>
             <property name="vexpand">1</property>
             <child>
               <object class="GtkPicture" id="image">
+                <accessibility>
+                  <property name="label">Font rendering example</property>
+                </accessibility>
                 <property name="halign">center</property>
                 <property name="valign">center</property>
                 <property name="can-shrink">0</property>
index 688f097745d152b0174d6ab2036a88d3c7586065..764a9206bdfd6ee8048861bf12e3e6a73f259310 100644 (file)
@@ -150,20 +150,36 @@ do_video_player (GtkWidget *do_widget)
 
       button = gtk_button_new ();
       image = gtk_image_new_from_resource ("/cursors/images/gtk_logo_cursor.png");
+      gtk_accessible_update_relation (GTK_ACCESSIBLE (image),
+                                      GTK_ACCESSIBLE_RELATION_LABELLED_BY, button, NULL,
+                                      -1);
       gtk_image_set_pixel_size (GTK_IMAGE (image), 24);
       gtk_button_set_child (GTK_BUTTON (button), image);
       g_signal_connect (button, "clicked", G_CALLBACK (logo_clicked_cb), video);
+      gtk_accessible_update_property (GTK_ACCESSIBLE (button),
+                                                      GTK_ACCESSIBLE_PROPERTY_LABEL, "GTK Logo",
+                                                      -1);
       gtk_header_bar_pack_start (GTK_HEADER_BAR (title), button);
 
       button = gtk_button_new ();
       image = gtk_image_new_from_resource ("/video-player/bbb.png");
+      gtk_accessible_update_relation (GTK_ACCESSIBLE (image),
+                                      GTK_ACCESSIBLE_RELATION_LABELLED_BY, button, NULL,
+                                      -1);
       gtk_image_set_pixel_size (GTK_IMAGE (image), 24);
       gtk_button_set_child (GTK_BUTTON (button), image);
       g_signal_connect (button, "clicked", G_CALLBACK (bbb_clicked_cb), video);
+      gtk_accessible_update_property (GTK_ACCESSIBLE (button),
+                                                      GTK_ACCESSIBLE_PROPERTY_LABEL, "Big Buck Bunny",
+                                                      -1);
       gtk_header_bar_pack_start (GTK_HEADER_BAR (title), button);
 
       fullscreen_button = gtk_button_new_from_icon_name ("view-fullscreen-symbolic");
       g_signal_connect (fullscreen_button, "clicked", G_CALLBACK (fullscreen_clicked_cb), NULL);
+      gtk_accessible_update_property (GTK_ACCESSIBLE (fullscreen_button),
+                                                      GTK_ACCESSIBLE_PROPERTY_LABEL, "Fullscreen",
+                                                      -1);
+
       gtk_header_bar_pack_end (GTK_HEADER_BAR (title), fullscreen_button);
 
       controller = gtk_shortcut_controller_new ();