[libadwaita/wip/exalm/spring-animation-swipes: 29/36] wip demo




commit 0fcbbe171dbba54cdb76f0793848f4443895c81d
Author: Manuel Genovés <manuel genoves gmail com>
Date:   Mon Dec 6 01:02:20 2021 +0100

    wip demo

 demo/adw-demo-window.c  | 100 +++++++++++++++--
 demo/adw-demo-window.ui | 282 ++++++++++++++++++++++++++++++++++++------------
 2 files changed, 307 insertions(+), 75 deletions(-)
---
diff --git a/demo/adw-demo-window.c b/demo/adw-demo-window.c
index c4cb8cb8..1abe2a24 100644
--- a/demo/adw-demo-window.c
+++ b/demo/adw-demo-window.c
@@ -29,6 +29,7 @@ struct _AdwDemoWindow
   GtkListBox *avatar_contacts;
   int toast_undo_items;
   AdwToast *undo_toast;
+  GtkStack *animation_preferences_stack;
   AdwAnimation *timed_animation;
   GtkWidget *timed_animation_sample;
   GtkWidget *timed_animation_button_box;
@@ -37,6 +38,13 @@ struct _AdwDemoWindow
   GtkSwitch *timed_animation_alternate;
   GtkSpinButton *timed_animation_duration;
   AdwComboRow *timed_animation_easing;
+  AdwAnimation *spring_animation;
+  GtkSpinButton *spring_animation_velocity;
+  GtkSpinButton *spring_animation_damping;
+  GtkSpinButton *spring_animation_mass;
+  GtkSpinButton *spring_animation_stiffness;
+  GtkSpinButton *spring_animation_precision;
+  GtkSwitch *spring_animation_in_place;
 };
 
 G_DEFINE_TYPE (AdwDemoWindow, adw_demo_window, ADW_TYPE_APPLICATION_WINDOW)
@@ -44,6 +52,7 @@ G_DEFINE_TYPE (AdwDemoWindow, adw_demo_window, ADW_TYPE_APPLICATION_WINDOW)
 enum {
   PROP_0,
   PROP_TIMED_ANIMATION,
+  PROP_SPRING_ANIMATION,
   LAST_PROP,
 };
 
@@ -69,6 +78,10 @@ adw_demo_window_get_property (GObject    *object,
     g_value_set_object (value, self->timed_animation);
     break;
 
+  case PROP_SPRING_ANIMATION:
+    g_value_set_object (value, self->spring_animation);
+    break;
+
   default:
     G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
   }
@@ -87,6 +100,10 @@ adw_demo_window_set_property (GObject      *object,
     g_set_object (&self->timed_animation, g_value_get_object (value));
     break;
 
+  case PROP_SPRING_ANIMATION:
+    g_set_object (&self->spring_animation, g_value_get_object (value));
+    break;
+
   default:
     G_OBJECT_WARN_INVALID_PROPERTY_ID (object, prop_id, pspec);
   }
@@ -443,6 +460,22 @@ tab_view_demo_clicked_cb (GtkButton     *btn,
   gtk_window_present (GTK_WINDOW (window));
 }
 
+static AdwAnimation *
+get_current_animation (AdwDemoWindow *self)
+{
+  const char *current_animation;
+
+  current_animation = g_strdup (gtk_stack_get_visible_child_name (self->animation_preferences_stack));
+
+  if (!g_strcmp0 (current_animation, "Timed")) {
+    return self->timed_animation;
+  } else if (!g_strcmp0 (current_animation, "Spring")) {
+    return self->spring_animation;
+  } else {
+    g_assert_not_reached ();
+  }
+}
+
 static char *
 animations_easing_name (AdwEnumListItem *value,
                         gpointer         user_data)
@@ -543,13 +576,14 @@ timed_animation_allocate (GtkWidget *widget,
 {
   AdwDemoWindow *self = ADW_DEMO_WINDOW (gtk_widget_get_root (widget));
   GtkWidget *child = gtk_widget_get_first_child (widget);
+  AdwAnimation *animation = get_current_animation (self);
   double progress;
   int child_width, offset;
 
   if (!child)
     return;
 
-  progress = adw_animation_get_value (self->timed_animation);
+  progress = adw_animation_get_value (animation);
 
   gtk_widget_measure (child, GTK_ORIENTATION_HORIZONTAL, -1,
                       &child_width, NULL, NULL, NULL);
@@ -563,32 +597,35 @@ timed_animation_allocate (GtkWidget *widget,
 static void
 timed_animation_reset (AdwDemoWindow *self)
 {
-  adw_animation_reset (self->timed_animation);
+  adw_animation_reset (get_current_animation (self));
 }
 
 static void
 timed_animation_play_pause (AdwDemoWindow *self)
 {
-  switch (adw_animation_get_state (self->timed_animation)) {
+  AdwAnimation *animation = get_current_animation (self);
+
+  switch (adw_animation_get_state (animation)) {
   case ADW_ANIMATION_IDLE:
   case ADW_ANIMATION_FINISHED:
-    adw_animation_play (self->timed_animation);
+    adw_animation_play (animation);
     break;
   case ADW_ANIMATION_PAUSED:
-    adw_animation_resume (self->timed_animation);
+    adw_animation_resume (animation);
     break;
   case ADW_ANIMATION_PLAYING:
-    adw_animation_pause (self->timed_animation);
+    adw_animation_pause (animation);
     break;
   default:
     g_assert_not_reached ();
   }
+
 }
 
 static void
 timed_animation_skip (AdwDemoWindow *self)
 {
-  adw_animation_skip (self->timed_animation);
+  adw_animation_skip (get_current_animation (self));
 }
 
 static char *
@@ -619,6 +656,17 @@ timed_animation_cb (double     value,
   gtk_widget_queue_allocate (self);
 }
 
+static void
+notify_spring_params_change (AdwDemoWindow *self)
+{
+  AdwSpringParams *spring_params =
+    adw_spring_params_new_full (gtk_spin_button_get_value(self->spring_animation_damping),
+                                gtk_spin_button_get_value(self->spring_animation_mass),
+                                gtk_spin_button_get_value(self->spring_animation_stiffness));
+
+  adw_spring_animation_set_spring_params (ADW_SPRING_ANIMATION (self->spring_animation), spring_params);
+}
+
 static void
 style_classes_demo_clicked_cb (GtkButton     *btn,
                                AdwDemoWindow *self)
@@ -741,6 +789,7 @@ adw_demo_window_class_init (AdwDemoWindowClass *klass)
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, avatar_remove_button);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, avatar_contacts);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, toast_overlay);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, animation_preferences_stack);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_sample);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_button_box);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_repeat_count);
@@ -748,6 +797,12 @@ adw_demo_window_class_init (AdwDemoWindowClass *klass)
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_alternate);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_duration);
   gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, timed_animation_easing);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_velocity);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_damping);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_mass);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_stiffness);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_precision);
+  gtk_widget_class_bind_template_child (widget_class, AdwDemoWindow, spring_animation_in_place);
   gtk_widget_class_bind_template_callback (widget_class, notify_visible_child_cb);
   gtk_widget_class_bind_template_callback (widget_class, back_clicked_cb);
   gtk_widget_class_bind_template_callback (widget_class, leaflet_back_clicked_cb);
@@ -778,6 +833,7 @@ adw_demo_window_class_init (AdwDemoWindowClass *klass)
   gtk_widget_class_bind_template_callback (widget_class, get_play_pause_icon_name);
   gtk_widget_class_bind_template_callback (widget_class, timed_animation_can_reset);
   gtk_widget_class_bind_template_callback (widget_class, timed_animation_can_skip);
+  gtk_widget_class_bind_template_callback (widget_class, notify_spring_params_change);
 
   props[PROP_TIMED_ANIMATION] =
     g_param_spec_object ("timed_animation",
@@ -786,6 +842,13 @@ adw_demo_window_class_init (AdwDemoWindowClass *klass)
                          ADW_TYPE_ANIMATION,
                          G_PARAM_READWRITE);
 
+  props[PROP_SPRING_ANIMATION] =
+    g_param_spec_object ("spring_animation",
+                         "Spring animation",
+                         "Spring animation",
+                         ADW_TYPE_ANIMATION,
+                         G_PARAM_READWRITE);
+
   g_object_class_install_properties (object_class, LAST_PROP, props);
 }
 
@@ -826,6 +889,22 @@ animation_page_init (AdwDemoWindow *self)
     adw_timed_animation_new (GTK_WIDGET (self->timed_animation_sample),
                              0, 1, 100, target);
 
+  AdwAnimationTarget *spring_target =
+    adw_callback_animation_target_new ((AdwAnimationTargetFunc)
+                                       gtk_widget_queue_allocate,
+                                       self->timed_animation_sample, NULL);
+
+  AdwSpringParams *spring_params =
+    adw_spring_params_new_full (400, 1, 100);
+
+  self->spring_animation =
+    adw_spring_animation_new (GTK_WIDGET (self->timed_animation_sample),
+                              0, 1, spring_params, spring_target);
+
+  g_print ("duration: %i", adw_spring_animation_get_estimated_duration 
(ADW_SPRING_ANIMATION(self->spring_animation)));
+  adw_spring_animation_set_initial_velocity (ADW_SPRING_ANIMATION(self->spring_animation), 0);
+  g_print ("duration: %i", adw_spring_animation_get_estimated_duration 
(ADW_SPRING_ANIMATION(self->spring_animation)));
+
   g_object_bind_property (self->timed_animation_repeat_count, "value",
                           self->timed_animation, "repeat-count",
                           G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
@@ -845,11 +924,18 @@ animation_page_init (AdwDemoWindow *self)
   g_object_bind_property (self->timed_animation_easing, "selected",
                           self->timed_animation, "easing",
                           G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
+  g_object_bind_property (self->spring_animation_velocity, "value",
+                          self->spring_animation, "initial_velocity",
+                          G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
+  g_object_bind_property (self->spring_animation_precision, "value",
+                          self->spring_animation, "epsilon",
+                          G_BINDING_SYNC_CREATE | G_BINDING_BIDIRECTIONAL);
 
   adw_timed_animation_set_easing (ADW_TIMED_ANIMATION (self->timed_animation),
                                   ADW_EASE_IN_OUT_CUBIC);
 
   g_object_notify_by_pspec (G_OBJECT (self), props[PROP_TIMED_ANIMATION]);
+  g_object_notify_by_pspec (G_OBJECT (self), props[PROP_SPRING_ANIMATION]);
 
   manager = gtk_custom_layout_new (NULL, timed_animation_measure,
                                    timed_animation_allocate);
diff --git a/demo/adw-demo-window.ui b/demo/adw-demo-window.ui
index b895625c..a1dd573c 100644
--- a/demo/adw-demo-window.ui
+++ b/demo/adw-demo-window.ui
@@ -1042,7 +1042,7 @@
                                             </child>
                                             <child>
                                               <object class="GtkLabel">
-                                                <property name="label" translatable="yes">Simple timed 
transitions.</property>
+                                                <property name="label" translatable="yes">Simple 
transitions.</property>
                                                 <property name="justify">center</property>
                                                 <property name="use_markup">true</property>
                                                 <property name="wrap">True</property>
@@ -1117,87 +1117,233 @@
                                             </child>
                                           </object>
                                         </child>
+                                        <child>
+                                          <object class="AdwPreferencesGroup">
+                                            <child>
+                                              <object class="GtkStackSwitcher">
+                                                <property name="stack">animation_preferences_stack</property>
+                                                <property name="margin-bottom">32</property>
+                                                <property name="halign">center</property>
+                                              </object>
+                                            </child>
+                                          </object>
+                                        </child>
                                         <child>
                                           <object class="AdwClamp">
                                             <property name="maximum-size">400</property>
                                             <property name="tightening-threshold">300</property>
                                             <property name="child">
-                                              <object class="AdwPreferencesGroup">
+                                              <object class="GtkStack" id="animation_preferences_stack">
+                                                <property name="transition-type">crossfade</property>
                                                 <child>
-                                                  <object class="AdwComboRow" id="timed_animation_easing">
-                                                    <property name="title" 
translatable="yes">Easing</property>
-                                                    <property name="model">
-                                                      <object class="AdwEnumListModel">
-                                                        <property name="enum-type">AdwEasing</property>
+                                                  <object class="GtkStackPage">
+                                                    <property name="title" 
translatable="yes">Timed</property>
+                                                    <property name="name">Timed</property>
+                                                    <property name="child">
+                                                      <object class="AdwPreferencesGroup">
+                                                        <child>
+                                                          <object class="AdwComboRow" 
id="timed_animation_easing">
+                                                            <property name="title" 
translatable="yes">Easing</property>
+                                                            <property name="model">
+                                                              <object class="AdwEnumListModel">
+                                                                <property 
name="enum-type">AdwEasing</property>
+                                                              </object>
+                                                            </property>
+                                                            <property name="expression">
+                                                              <closure type="gchararray" 
function="animations_easing_name"/>
+                                                            </property>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Duration</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="timed_animation_duration">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">100</property>
+                                                                    <property name="upper">4000</property>
+                                                                    <property name="value">500</property>
+                                                                    <property 
name="page-increment">100</property>
+                                                                    <property 
name="step-increment">50</property>
+                                                                  </object>
+                                                                </property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" translatable="yes">Repeat 
count</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="timed_animation_repeat_count">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">0</property>
+                                                                    <property name="upper">10</property>
+                                                                    <property name="value">1</property>
+                                                                    <property 
name="page-increment">1</property>
+                                                                    <property 
name="step-increment">1</property>
+                                                                  </object>
+                                                                </property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Reverse</property>
+                                                            <property 
name="activatable_widget">timed_animation_reverse</property>
+                                                            <child>
+                                                              <object class="GtkSwitch" 
id="timed_animation_reverse">
+                                                                <property name="valign">center</property>
+                                                                <property name="state">False</property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Alternate</property>
+                                                            <property 
name="activatable_widget">timed_animation_alternate</property>
+                                                            <child>
+                                                              <object class="GtkSwitch" 
id="timed_animation_alternate">
+                                                                <property name="valign">center</property>
+                                                                <property name="state">False</property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
                                                       </object>
                                                     </property>
-                                                    <property name="expression">
-                                                      <closure type="gchararray" 
function="animations_easing_name"/>
-                                                    </property>
                                                   </object>
                                                 </child>
                                                 <child>
-                                                  <object class="AdwActionRow">
-                                                    <property name="title" 
translatable="yes">Duration</property>
-                                                    <child>
-                                                      <object class="GtkSpinButton" 
id="timed_animation_duration">
-                                                        <property name="valign">center</property>
-                                                        <property name="numeric">True</property>
-                                                        <property name="adjustment">
-                                                          <object class="GtkAdjustment">
-                                                            <property name="lower">100</property>
-                                                            <property name="upper">4000</property>
-                                                            <property name="value">500</property>
-                                                            <property name="page-increment">100</property>
-                                                            <property name="step-increment">50</property>
+                                                  <object class="GtkStackPage">
+                                                    <property name="title" 
translatable="yes">Spring</property>
+                                                    <property name="name">Spring</property>
+                                                    <property name="child">
+                                                      <object class="AdwPreferencesGroup">
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Initial velocity</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="spring_animation_velocity">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">-1000</property>
+                                                                    <property name="upper">1000</property>
+                                                                    <property name="value">0</property>
+                                                                    <property 
name="page-increment">10</property>
+                                                                    <property 
name="step-increment">1</property>
+                                                                  </object>
+                                                                </property>
+                                                              </object>
+                                                            </child>
                                                           </object>
-                                                        </property>
-                                                      </object>
-                                                    </child>
-                                                  </object>
-                                                </child>
-                                                <child>
-                                                  <object class="AdwActionRow">
-                                                    <property name="title" translatable="yes">Repeat 
count</property>
-                                                    <child>
-                                                      <object class="GtkSpinButton" 
id="timed_animation_repeat_count">
-                                                        <property name="valign">center</property>
-                                                        <property name="numeric">True</property>
-                                                        <property name="adjustment">
-                                                          <object class="GtkAdjustment">
-                                                            <property name="lower">0</property>
-                                                            <property name="upper">10</property>
-                                                            <property name="value">1</property>
-                                                            <property name="page-increment">1</property>
-                                                            <property name="step-increment">1</property>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Damping</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="spring_animation_damping">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">0</property>
+                                                                    <property name="upper">1000</property>
+                                                                    <property name="value">100</property>
+                                                                    <property 
name="page-increment">10</property>
+                                                                    <property 
name="step-increment">1</property>
+                                                                  </object>
+                                                                </property>
+                                                                <signal name="value-changed" 
handler="notify_spring_params_change" swapped="yes"/>
+                                                              </object>
+                                                            </child>
                                                           </object>
-                                                        </property>
-                                                      </object>
-                                                    </child>
-                                                  </object>
-                                                </child>
-                                                <child>
-                                                  <object class="AdwActionRow">
-                                                    <property name="title" 
translatable="yes">Reverse</property>
-                                                    <property 
name="activatable_widget">timed_animation_reverse</property>
-                                                    <child>
-                                                      <object class="GtkSwitch" id="timed_animation_reverse">
-                                                        <property name="valign">center</property>
-                                                        <property name="state">False</property>
-                                                      </object>
-                                                    </child>
-                                                  </object>
-                                                </child>
-                                                <child>
-                                                  <object class="AdwActionRow">
-                                                    <property name="title" 
translatable="yes">Alternate</property>
-                                                    <property 
name="activatable_widget">timed_animation_alternate</property>
-                                                    <child>
-                                                      <object class="GtkSwitch" 
id="timed_animation_alternate">
-                                                        <property name="valign">center</property>
-                                                        <property name="state">False</property>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Mass</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="spring_animation_mass">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">0</property>
+                                                                    <property name="upper">100</property>
+                                                                    <property name="value">1</property>
+                                                                    <property 
name="page-increment">10</property>
+                                                                    <property 
name="step-increment">1</property>
+                                                                  </object>
+                                                                </property>
+                                                                <signal name="value-changed" 
handler="notify_spring_params_change" swapped="yes"/>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Stiffness</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="spring_animation_stiffness">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">0</property>
+                                                                    <property name="upper">1000</property>
+                                                                    <property name="value">100</property>
+                                                                    <property 
name="page-increment">10</property>
+                                                                    <property 
name="step-increment">1</property>
+                                                                  </object>
+                                                                </property>
+                                                                <signal name="value-changed" 
handler="notify_spring_params_change" swapped="yes"/>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" 
translatable="yes">Precision</property>
+                                                            <child>
+                                                              <object class="GtkSpinButton" 
id="spring_animation_precision">
+                                                                <property name="valign">center</property>
+                                                                <property name="numeric">True</property>
+                                                                <property name="digits">5</property>
+                                                                <property name="adjustment">
+                                                                  <object class="GtkAdjustment">
+                                                                    <property name="lower">0.0001</property>
+                                                                    <property name="upper">0.01</property>
+                                                                    <property name="value">0.001</property>
+                                                                    <property 
name="page-increment">0.001</property>
+                                                                    <property 
name="step-increment">0.001</property>
+                                                                  </object>
+                                                                </property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
+                                                        <child>
+                                                          <object class="AdwActionRow">
+                                                            <property name="title" translatable="yes">In 
place</property>
+                                                            <child>
+                                                              <object class="GtkSwitch" 
id="spring_animation_in_place">
+                                                                <property name="valign">center</property>
+                                                              </object>
+                                                            </child>
+                                                          </object>
+                                                        </child>
                                                       </object>
-                                                    </child>
+                                                    </property>
                                                   </object>
                                                 </child>
                                               </object>


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]