Skip to content

Commit df97bb9

Browse files
alainm23alainm23
committed
*
1 parent f835f54 commit df97bb9

File tree

5 files changed

+150
-45
lines changed

5 files changed

+150
-45
lines changed

‎data/Application.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,4 +8,14 @@
88

99
.fancy-turn.animation {
1010
animation: fancy-turn 0.7s ease-in-out;
11+
}
12+
13+
.number {
14+
background: #8cd5ff;
15+
border-radius: 6px;
16+
color: #0d52bf;
17+
}
18+
19+
.fw-500 {
20+
font-weight: 500;
1121
}

‎meson.build‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ executable(
4545
'src/MainWindow.vala',
4646
'src/Views/Form.vala',
4747
'src/Views/Success.vala',
48+
'src/Widgets/Stepper.vala',
4849
dependencies: deps,
4950
install: true
5051
)

‎src/MainWindow.vala‎

Lines changed: 58 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/*
22
* SPDX-License-Identifier: GPL-3.0-or-later
3-
* SPDX-FileCopyrightText: 2021 Your Name <you@email.com>
3+
* SPDX-FileCopyrightText: 2024 Alain <Alainmh23@gmail.com>
44
*/
55

66
public class MainWindow : Gtk.ApplicationWindow {
@@ -22,14 +22,46 @@ public class MainWindow : Gtk.ApplicationWindow {
2222
}
2323

2424
construct {
25-
var dir = Environment.get_user_data_dir ();
26-
print ("DIR: %s".printf (dir));
27-
2825
var headerbar = new Gtk.HeaderBar () {
2926
title_widget = new Gtk.Label (null),
3027
hexpand = true
3128
};
3229

30+
var project_icon = new Gtk.Image.from_icon_name ("applications-development") {
31+
pixel_size = 96
32+
};
33+
34+
var title_label = new Gtk.Label (_("App Generator"));
35+
title_label.add_css_class (Granite.STYLE_CLASS_H1_LABEL);
36+
37+
var description_label = new Gtk.Label (_("Create an elementary OS app using one of the pre-made app templates")) {
38+
wrap = true,
39+
justify = CENTER
40+
};
41+
description_label.add_css_class (Granite.STYLE_CLASS_DIM_LABEL);
42+
43+
var left_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 6) {
44+
valign = CENTER,
45+
hexpand = true,
46+
margin_start = 24,
47+
margin_end = 24,
48+
margin_bottom = 24
49+
};
50+
left_box.append (project_icon);
51+
left_box.append (title_label);
52+
left_box.append (description_label);
53+
54+
var stepper = new Widgets.Stepper () {
55+
margin_start = 24
56+
};
57+
stepper.add_step ("1", _("App Type"));
58+
stepper.add_step ("2", _("Developer Data"));
59+
stepper.add_step ("3", _("Application Data"));
60+
61+
stepper.activeStepChange.connect (() => {
62+
print ("Index %d\n".printf (stepper.active_index));
63+
});
64+
3365
var form_view = new Views.Form ();
3466
var success_view = new Views.Success ();
3567

@@ -39,9 +71,30 @@ public class MainWindow : Gtk.ApplicationWindow {
3971
main_stack.add_named (form_view, "form");
4072
main_stack.add_named (success_view, "success");
4173

74+
var form_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 6);
75+
form_box.append (stepper);
76+
form_box.append (new Gtk.Separator (Gtk.Orientation.HORIZONTAL) {
77+
margin_start = 24,
78+
margin_end = 24,
79+
margin_top = 12,
80+
margin_bottom = 12
81+
});
82+
form_box.append (main_stack);
83+
84+
var main_box = new Gtk.CenterBox () {
85+
hexpand = true,
86+
vexpand = true
87+
};
88+
89+
main_box.start_widget = left_box;
90+
main_box.center_widget = new Gtk.Separator (Gtk.Orientation.VERTICAL) {
91+
margin_bottom = 32
92+
};
93+
main_box.end_widget = form_box;
94+
4295
var toolbar_view = new Adw.ToolbarView ();
4396
toolbar_view.add_top_bar (headerbar);
44-
toolbar_view.content = main_stack;
97+
toolbar_view.content = main_box;
4598

4699
child = toolbar_view;
47100

‎src/Views/Form.vala‎

Lines changed: 15 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -13,30 +13,6 @@ public class Views.Form : Adw.Bin {
1313
public signal void created (string project_name, string location);
1414

1515
construct {
16-
var project_icon = new Gtk.Image.from_icon_name ("applications-development") {
17-
pixel_size = 96
18-
};
19-
20-
var title_label = new Gtk.Label (_("App Generator"));
21-
title_label.add_css_class (Granite.STYLE_CLASS_H1_LABEL);
22-
23-
var description_label = new Gtk.Label (_("Create an elementary OS app using one of the pre-made app templates")) {
24-
wrap = true,
25-
justify = CENTER
26-
};
27-
description_label.add_css_class (Granite.STYLE_CLASS_DIM_LABEL);
28-
29-
var left_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 6) {
30-
valign = CENTER,
31-
hexpand = true,
32-
margin_start = 24,
33-
margin_end = 24,
34-
margin_bottom = 24
35-
};
36-
left_box.append (project_icon);
37-
left_box.append (title_label);
38-
left_box.append (description_label);
39-
4016
Regex? project_name_regex = null;
4117
Regex? identifier_regex = null;
4218
try {
@@ -99,12 +75,22 @@ public class Views.Form : Adw.Bin {
9975

10076
var create_button = new Gtk.Button () {
10177
child = button_stack,
102-
margin_top = 24,
103-
sensitive = false
78+
margin_bottom = 32,
79+
sensitive = false,
80+
vexpand = true,
81+
valign = END
10482
};
10583
create_button.add_css_class (Granite.STYLE_CLASS_SUGGESTED_ACTION);
10684

10785
var form_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0);
86+
form_box.append (new Gtk.Label (_("Step 1/3")) {
87+
halign = START,
88+
css_classes = { Granite.STYLE_CLASS_DIM_LABEL }
89+
});
90+
form_box.append (new Gtk.Label (_("Sign Up")) {
91+
halign = START,
92+
css_classes = { Granite.STYLE_CLASS_H1_LABEL }
93+
});
10894
form_box.append (new Granite.HeaderLabel (_("Project Name:")));
10995
form_box.append (project_name_entry);
11096
form_box.append (project_name_description);
@@ -117,29 +103,18 @@ public class Views.Form : Adw.Bin {
117103
form_box.append (location_entry);
118104
form_box.append (create_button);
119105

120-
var right_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0) {
106+
var content_box = new Gtk.Box (Gtk.Orientation.VERTICAL, 0) {
121107
margin_start = 24,
122108
margin_end = 24,
123109
hexpand = true
124110
};
125111

126-
right_box.append (form_box);
127-
128-
var main_box = new Gtk.CenterBox () {
129-
hexpand = true,
130-
vexpand = true
131-
};
132-
133-
main_box.start_widget = left_box;
134-
main_box.center_widget = new Gtk.Separator (Gtk.Orientation.VERTICAL) {
135-
margin_bottom = 32
136-
};
137-
main_box.end_widget = right_box;
112+
content_box.append (form_box);
138113

139114
toast = new Granite.Toast ("");
140115

141116
var overlay = new Gtk.Overlay () {
142-
child = main_box
117+
child = content_box
143118
};
144119
overlay.add_overlay (toast);
145120
overlay.set_measure_overlay (toast, true);

‎src/Widgets/Stepper.vala‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/*
2+
* SPDX-License-Identifier: GPL-3.0-or-later
3+
* SPDX-FileCopyrightText: 2024 Alain <[email protected]>
4+
*/
5+
6+
public class Widgets.Stepper : Gtk.Grid {
7+
private Gtk.Box main_box;
8+
9+
public int index { get; set; default = 0; }
10+
11+
int _active_index = 0;
12+
public int active_index {
13+
get {
14+
return _active_index;
15+
}
16+
17+
set {
18+
foreach (Gtk.Button button in stepper_map.values) {
19+
button.remove_css_class (Granite.STYLE_CLASS_SUGGESTED_ACTION);
20+
}
21+
22+
if (stepper_map.has_key (value)) {
23+
stepper_map.get (value).add_css_class (Granite.STYLE_CLASS_SUGGESTED_ACTION);
24+
}
25+
26+
_active_index = value;
27+
activeStepChange ();
28+
}
29+
}
30+
31+
public signal void activeStepChange ();
32+
33+
private Gee.HashMap<int, Gtk.Button> stepper_map = new Gee.HashMap<int, Gtk.Button> ();
34+
35+
construct {
36+
main_box = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 24);
37+
attach (main_box, 0, 0);
38+
}
39+
40+
public void add_step (string number, string name) {
41+
var number_button = new Gtk.Button.with_label (number) {
42+
width_request = 24
43+
};
44+
number_button.set_data ("index", index);
45+
46+
if (index <= 0) {
47+
number_button.add_css_class (Granite.STYLE_CLASS_SUGGESTED_ACTION);
48+
}
49+
50+
number_button.clicked.connect (() => {
51+
active_index = number_button.get_data ("index");
52+
});
53+
54+
var name_label = new Gtk.Label (name);
55+
name_label.add_css_class ("fw-500");
56+
57+
var button_box = new Gtk.Box (Gtk.Orientation.HORIZONTAL, 6);
58+
button_box.append (number_button);
59+
button_box.append (name_label);
60+
61+
main_box.append (button_box);
62+
63+
stepper_map[index] = number_button;
64+
index++;
65+
}
66+
}

0 commit comments

Comments
 (0)