From 8d7e515d1860af42a32b91f730b05d71e9d35c89 Mon Sep 17 00:00:00 2001 From: Sriyansh Shivam Date: Tue, 7 Mar 2023 01:00:02 +0530 Subject: [PATCH 1/6] Applied Changes --- src/Library/demos/Scale/main.blp | 58 +++++++++++++++++++++++++++++++ src/Library/demos/Scale/main.js | 35 +++++++++++++++++++ src/Library/demos/Scale/main.json | 10 ++++++ 3 files changed, 103 insertions(+) create mode 100644 src/Library/demos/Scale/main.blp create mode 100644 src/Library/demos/Scale/main.js create mode 100644 src/Library/demos/Scale/main.json diff --git a/src/Library/demos/Scale/main.blp b/src/Library/demos/Scale/main.blp new file mode 100644 index 000000000..698f5b3a1 --- /dev/null +++ b/src/Library/demos/Scale/main.blp @@ -0,0 +1,58 @@ +using Gtk 4.0; +using Adw 1; + +Adw.StatusPage { + title: "Scale"; + description: _("Slider control to select a value from a range"); + + Box { + orientation: vertical; + halign: center; + + Box{ + halign: center; + + Scale one { + orientation: horizontal; + margin-bottom: 20; + width-request: 130; + draw-value: true; + margin-end: 40; + adjustment: Gtk.Adjustment { + lower: 0; + upper: 100; + value: 0; + }; + } + + Scale two { + orientation: vertical; + margin-bottom: 20; + height-request: 140; + adjustment: Gtk.Adjustment { + lower: 0; + upper: 100; + value: 0; + }; + } + } + Scale disabled { + orientation: horizontal; + sensitive: false; + margin-bottom: 20; + } + + LinkButton { + label: "API Reference"; + uri: "https://docs.gtk.org/gtk4/class.Scale.html"; + } + + LinkButton { + label: "Human Interface Guidelines"; + uri: "https://developer.gnome.org/hig/patterns/controls/sliders.html"; + } + } +} + + + diff --git a/src/Library/demos/Scale/main.js b/src/Library/demos/Scale/main.js new file mode 100644 index 000000000..a2c64549d --- /dev/null +++ b/src/Library/demos/Scale/main.js @@ -0,0 +1,35 @@ +const scale_one = workbench.builder.get_object("one"); +const scale_two = workbench.builder.get_object("two"); +const scale_disabled = workbench.builder.get_object("disabled"); + +scale_two.add_mark(25.0, "left", "A"); +scale_two.add_mark(50.0, "right", "B"); +scale_two.add_mark(75.0, "right", "C"); +scale_two.add_mark(100.0, "right", "D"); +scale_two.set_increments(25.0, 25.0); + +scale_disabled.set_range(true, 50); +scale_disabled.set_value(25); +scale_disabled.set_show_fill_level(25); + +scale_one.connect("value-changed", () => { + let scale_value = scale_one.get_value(); + if (scale_value === scale_one.adjustment.upper) { + console.log("Max Value Reached"); + } else if (scale_value === scale_one.adjustment.lower) { + console.log("Min Value Reached"); + } +}); + +scale_two.connect("value-changed", () => { + let scale_value_two = scale_two.get_value(); + if (scale_value_two === 25) { + console.log("Mark A Reached"); + } else if (scale_value_two === 50) { + console.log("Mark B Reached"); + } else if (scale_value_two === 75) { + console.log("Mark C Reached"); + } else if (scale_value_two === 100) { + console.log("Mark D Reached"); + } +}); diff --git a/src/Library/demos/Scale/main.json b/src/Library/demos/Scale/main.json new file mode 100644 index 000000000..ff9cb9ca9 --- /dev/null +++ b/src/Library/demos/Scale/main.json @@ -0,0 +1,10 @@ +{ + "name": "Scale", + "category": "user_interface", + "description": "Slider control to select a value from a range", + "panels": [ + "ui", + "preview" + ], + "autorun": true +} From 31ea2b3b565e99f52eb5990ea17eae3f39a4ef2e Mon Sep 17 00:00:00 2001 From: Sriyansh Shivam Date: Tue, 7 Mar 2023 01:09:46 +0530 Subject: [PATCH 2/6] Updated Third Slider --- src/Library/demos/Scale/main.blp | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/src/Library/demos/Scale/main.blp b/src/Library/demos/Scale/main.blp index 698f5b3a1..eb7b9ab22 100644 --- a/src/Library/demos/Scale/main.blp +++ b/src/Library/demos/Scale/main.blp @@ -40,6 +40,12 @@ Adw.StatusPage { orientation: horizontal; sensitive: false; margin-bottom: 20; + adjustment: Gtk.Adjustment { + lower: 0; + upper: 50; + value: 25; + }; + } } LinkButton { From 62e25b99291988ebf223dbac35bad84acc5e4eea Mon Sep 17 00:00:00 2001 From: Sriyansh Shivam Date: Wed, 8 Mar 2023 03:12:12 +0530 Subject: [PATCH 3/6] Updated Scale Entry --- src/Library/demos/Scale/main.blp | 1 - src/Library/demos/Scale/main.js | 2 -- 2 files changed, 3 deletions(-) diff --git a/src/Library/demos/Scale/main.blp b/src/Library/demos/Scale/main.blp index eb7b9ab22..f602d5554 100644 --- a/src/Library/demos/Scale/main.blp +++ b/src/Library/demos/Scale/main.blp @@ -45,7 +45,6 @@ Adw.StatusPage { upper: 50; value: 25; }; - } } LinkButton { diff --git a/src/Library/demos/Scale/main.js b/src/Library/demos/Scale/main.js index a2c64549d..05562e03c 100644 --- a/src/Library/demos/Scale/main.js +++ b/src/Library/demos/Scale/main.js @@ -8,8 +8,6 @@ scale_two.add_mark(75.0, "right", "C"); scale_two.add_mark(100.0, "right", "D"); scale_two.set_increments(25.0, 25.0); -scale_disabled.set_range(true, 50); -scale_disabled.set_value(25); scale_disabled.set_show_fill_level(25); scale_one.connect("value-changed", () => { From 3ba4ba3c83c060ce9f68d6e70afed3ca89ea056a Mon Sep 17 00:00:00 2001 From: Sriyansh Shivam Date: Wed, 8 Mar 2023 18:07:10 +0530 Subject: [PATCH 4/6] Applied Suggested Changes --- src/Library/demos/Scale/main.blp | 10 ++++++---- src/Library/demos/Scale/main.js | 29 +++++++++++++++-------------- 2 files changed, 21 insertions(+), 18 deletions(-) diff --git a/src/Library/demos/Scale/main.blp b/src/Library/demos/Scale/main.blp index f602d5554..bcf174a19 100644 --- a/src/Library/demos/Scale/main.blp +++ b/src/Library/demos/Scale/main.blp @@ -14,10 +14,10 @@ Adw.StatusPage { Scale one { orientation: horizontal; - margin-bottom: 20; + margin-bottom: 18; width-request: 130; draw-value: true; - margin-end: 40; + margin-end: 36; adjustment: Gtk.Adjustment { lower: 0; upper: 100; @@ -27,7 +27,7 @@ Adw.StatusPage { Scale two { orientation: vertical; - margin-bottom: 20; + margin-bottom: 18; height-request: 140; adjustment: Gtk.Adjustment { lower: 0; @@ -39,7 +39,8 @@ Adw.StatusPage { Scale disabled { orientation: horizontal; sensitive: false; - margin-bottom: 20; + margin-bottom: 18; + show-fill-level: true; adjustment: Gtk.Adjustment { lower: 0; upper: 50; @@ -61,3 +62,4 @@ Adw.StatusPage { + diff --git a/src/Library/demos/Scale/main.js b/src/Library/demos/Scale/main.js index 05562e03c..a3caead28 100644 --- a/src/Library/demos/Scale/main.js +++ b/src/Library/demos/Scale/main.js @@ -1,6 +1,17 @@ const scale_one = workbench.builder.get_object("one"); const scale_two = workbench.builder.get_object("two"); -const scale_disabled = workbench.builder.get_object("disabled"); + +function logMarks(scale_value_two) { + const marks = { + 25: "Mark A Reached", + 50: "Mark B Reached", + 75: "Mark C Reached", + 100: "Mark D Reached", + }; + if (scale_value_two in marks) { + console.log(marks[scale_value_two]); + } +} scale_two.add_mark(25.0, "left", "A"); scale_two.add_mark(50.0, "right", "B"); @@ -8,26 +19,16 @@ scale_two.add_mark(75.0, "right", "C"); scale_two.add_mark(100.0, "right", "D"); scale_two.set_increments(25.0, 25.0); -scale_disabled.set_show_fill_level(25); - scale_one.connect("value-changed", () => { let scale_value = scale_one.get_value(); if (scale_value === scale_one.adjustment.upper) { - console.log("Max Value Reached"); + console.log("Maximum Value Reached"); } else if (scale_value === scale_one.adjustment.lower) { - console.log("Min Value Reached"); + console.log("Minimum Value Reached"); } }); scale_two.connect("value-changed", () => { let scale_value_two = scale_two.get_value(); - if (scale_value_two === 25) { - console.log("Mark A Reached"); - } else if (scale_value_two === 50) { - console.log("Mark B Reached"); - } else if (scale_value_two === 75) { - console.log("Mark C Reached"); - } else if (scale_value_two === 100) { - console.log("Mark D Reached"); - } + logMarks(scale_value_two); }); From 4f8e9c54036b8c9904a6555d86a18019b1978bec Mon Sep 17 00:00:00 2001 From: Sonny Piers Date: Wed, 8 Mar 2023 15:33:58 +0100 Subject: [PATCH 5/6] improve code --- src/Library/demos/Scale/main.js | 40 ++++++++++++++++----------------- 1 file changed, 19 insertions(+), 21 deletions(-) diff --git a/src/Library/demos/Scale/main.js b/src/Library/demos/Scale/main.js index a3caead28..1079b0c86 100644 --- a/src/Library/demos/Scale/main.js +++ b/src/Library/demos/Scale/main.js @@ -1,34 +1,32 @@ +import Gtk from "gi://Gtk"; + const scale_one = workbench.builder.get_object("one"); const scale_two = workbench.builder.get_object("two"); -function logMarks(scale_value_two) { - const marks = { - 25: "Mark A Reached", - 50: "Mark B Reached", - 75: "Mark C Reached", - 100: "Mark D Reached", - }; - if (scale_value_two in marks) { - console.log(marks[scale_value_two]); - } -} +const marks = { + 0: "A", + 50: "B", + 100: "C", +}; -scale_two.add_mark(25.0, "left", "A"); -scale_two.add_mark(50.0, "right", "B"); -scale_two.add_mark(75.0, "right", "C"); -scale_two.add_mark(100.0, "right", "D"); -scale_two.set_increments(25.0, 25.0); +for (const [value, label] of Object.entries(marks)) { + scale_two.add_mark(value, Gtk.PositionType.RIGHT, label); +} +scale_two.set_increments(25, 100); scale_one.connect("value-changed", () => { - let scale_value = scale_one.get_value(); + const scale_value = scale_one.get_value(); if (scale_value === scale_one.adjustment.upper) { - console.log("Maximum Value Reached"); + console.log("Maximum value reached"); } else if (scale_value === scale_one.adjustment.lower) { - console.log("Minimum Value Reached"); + console.log("Minimum value reached"); } }); scale_two.connect("value-changed", () => { - let scale_value_two = scale_two.get_value(); - logMarks(scale_value_two); + const scale_value = scale_two.get_value(); + const label = marks[scale_value]; + if (!label) return; + + console.log(`Mark ${label} reached`); }); From 17685f8cdb3a418a0e4f4de652c68649a3b3b04f Mon Sep 17 00:00:00 2001 From: Sonny Piers Date: Wed, 8 Mar 2023 16:30:03 +0100 Subject: [PATCH 6/6] fix formatting --- src/Library/demos/Scale/main.blp | 52 +++++++++++++++----------------- 1 file changed, 24 insertions(+), 28 deletions(-) diff --git a/src/Library/demos/Scale/main.blp b/src/Library/demos/Scale/main.blp index bcf174a19..87ffdf8ff 100644 --- a/src/Library/demos/Scale/main.blp +++ b/src/Library/demos/Scale/main.blp @@ -12,30 +12,30 @@ Adw.StatusPage { Box{ halign: center; - Scale one { - orientation: horizontal; - margin-bottom: 18; - width-request: 130; - draw-value: true; - margin-end: 36; - adjustment: Gtk.Adjustment { - lower: 0; - upper: 100; - value: 0; - }; - } - - Scale two { - orientation: vertical; - margin-bottom: 18; - height-request: 140; - adjustment: Gtk.Adjustment { - lower: 0; - upper: 100; - value: 0; - }; - } - } + Scale one { + orientation: horizontal; + margin-bottom: 18; + width-request: 130; + draw-value: true; + margin-end: 36; + adjustment: Gtk.Adjustment { + lower: 0; + upper: 100; + value: 0; + }; + } + + Scale two { + orientation: vertical; + margin-bottom: 18; + height-request: 140; + adjustment: Gtk.Adjustment { + lower: 0; + upper: 100; + value: 0; + }; + } + } Scale disabled { orientation: horizontal; sensitive: false; @@ -59,7 +59,3 @@ Adw.StatusPage { } } } - - - -