Try out mcdu layout

Cargo.lock

@@ -974,6 +974,7 @@ dependencies = [
  "relm4",
  "relm4-components",
  "relm4-icons",
+ "relm4-macros",
 ]
 
 [[package]]

Cargo.toml

@@ -8,6 +8,7 @@ edition = "2021"
 [dependencies]
 # Core library
 relm4 = "0.6.2"
+relm4-macros = "0.6.2"
 # Optional: reusable components
 relm4-components = "0.6.2"
 # Optional: icons

src/main.rs

@@ -1,5 +1,6 @@
 use gtk::glib::clone;
 use gtk::prelude::{BoxExt, ButtonExt, GtkWindowExt};
+use relm4::gtk::prelude::GridExt;
 use relm4::{gtk, ComponentParts, ComponentSender, RelmApp, RelmWidgetExt, SimpleComponent};
 
 struct AppModel {
@@ -42,32 +43,68 @@ impl SimpleComponent for AppModel {
         window: &Self::Root,
         sender: ComponentSender<Self>,
     ) -> relm4::ComponentParts<Self> {
+        relm4_icons::initialize_icons();
         let model = AppModel { counter };
 
-        let vbox = gtk::Box::builder()
-            .orientation(gtk::Orientation::Vertical)
-            .spacing(5)
+        let layout = gtk::Box::builder()
+            .orientation(gtk::Orientation::Horizontal)
+            // .spacing(5)
             .build();
 
-        let inc_button = gtk::Button::with_label("Increment");
+        let tab_chooser = gtk::Box::builder()
+            .orientation(gtk::Orientation::Vertical)
+            .build();
+        let main_view = gtk::Box::builder()
+            .orientation(gtk::Orientation::Vertical)
+            .build();
+        let ll = gtk::GridLayout::builder()
+            .column_homogeneous(true)
+            .row_homogeneous(true)
+            .build();
+
+        let mcdu = gtk::Grid::builder().build();
+        mcdu.set_column_spacing(5);
+        mcdu.set_row_spacing(5);
+        // mcdu.insert_row(0);
+        let a = gtk::Button::default();
+        a.set_label("a");
+        let b = gtk::Button::default();
+        b.set_label("b");
+
+        let alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
+
+        let mcdu_width = 6;
+        for (i, c) in alphabet.char_indices() {
+            let button = gtk::Button::default();
+            button.set_label(&c.to_string());
+
+            let column = i % mcdu_width;
+            let row = (i - column) / mcdu_width;
+
+            mcdu.attach(&button, column as i32, row as i32, 1, 1);
+        }
+        // mcdu.attach(&b, 1, 0, 1, 1);
+        // mcdu.
+        // .orientation(gtk::Orientation::Vertical)
+        // .build();
+
+        let inc_button = gtk::Button::with_label("Increment3");
         let dec_button = gtk::Button::with_label("Decrement");
 
+        let x = gtk::Button::default();
+        x.set_label("Tab 1");
+        // x.set_icon_name("plus");
+
+        tab_chooser.append(&x);
+
         let label = gtk::Label::new(Some(&format!("Counter: {}", model.counter)));
         label.set_margin_all(5);
 
-        window.set_child(Some(&vbox));
-        vbox.set_margin_all(5);
-        vbox.append(&inc_button);
-        vbox.append(&dec_button);
-        vbox.append(&label);
-
-        inc_button.connect_clicked(clone!(@strong sender => move |_| {
-            sender.input(AppInput::Increment);
-        }));
-
-        dec_button.connect_clicked(clone!(@strong sender => move |_| {
-            sender.input(AppInput::Decrement);
-        }));
+        window.set_child(Some(&layout));
+        layout.set_margin_all(5);
+        layout.append(&tab_chooser);
+        layout.append(&main_view);
+        layout.append(&mcdu);
 
         let widgets = AppWidgets { label };