Add Tabbed View

README.md

@@ -60,6 +60,7 @@ app.run()
     * Codefield
     * Scrollbar (Verical & Horizontal)
     * Frames & Nested-Frames
+    * Tabbed View
 * Custom/Thirdparty Widget Support (Not Finished Completely Yet)
 * Screen Reader Support (Experimental - Linux & Windows Only)
 * Emoji Icon Support (Desktop Only)
@@ -82,7 +83,6 @@ app.run()
 ## To-Do List
 
 * Widgets:
-    * Tabs
     * Treeview
     * Status Bar
     * Spinner

button.v

@@ -22,7 +22,8 @@ pub fn add_button(mut app &Window, text string, id string, x string|int, y strin
         "bg":   WindowData{clr:bg},
         "fg":   WindowData{clr:fg},
         "fn":   WindowData{fun:fun},
-        "icon": WindowData{bol:icon}
+        "icon": WindowData{bol:icon},
+        "tabvw":WindowData{str:""}, // for tabbed view
     }
     if dialog {app.dialog_objects << widget.clone()} else {app.objects << widget.clone()}
 }

examples/tab_example.v

@@ -0,0 +1,20 @@
+import malisipi.mui as m
+
+fn increase_count(event_details m.EventDetails,mut app &m.Window, app_data voidptr){
+	unsafe{
+		app.get_object_by_id("count")[0]["text"].str=(app.get_object_by_id("count")[0]["text"].str.int()+1).str()
+	}
+}
+
+mut app:=m.create(m.WindowConfig{ title:"Tabbed View - MUI Example", height:100, width:400 })
+
+unsafe {
+	app.tab_view(m.Widget{ id:"tab_view", x:"5%x", y:"5%y", width:"90%x", height:"90%y", active_tab:"frame_count_label", tabs:[
+		["Label","frame_count_label"],
+		["Button","frame_count_button"]
+	]})
+}
+app.label(m.Widget{ id:"count", x:"5%x", y:"5%y", width:"90%x", height:"90%y", text:"0", frame:"frame_count_label" })
+app.button(m.Widget{ id:"count_button", x:"5%x", y:"5%y", width:"90%x", height:"90%y", text:"Count", onclick:increase_count, frame:"frame_count_button" })
+
+app.run()

frame.v

@@ -19,6 +19,7 @@ pub fn add_frame(mut app &Window, id string, x string|int, y string|int, w strin
 		"h_raw":WindowData{str: match h{ int{ h.str() } string{ h } } },
         "hi":	WindowData{bol:hi},
         "bg":   WindowData{clr:bg},
+        "acttb":WindowData{str:""}, // for tabbed view
     }
     if dialog {app.dialog_objects << widget.clone()} else {app.objects << widget.clone()}
 }

tabs.v

@@ -0,0 +1,36 @@
+module mui
+/*
+tabs:[
+    ["Test Tab","test_tab"]
+]
+*/
+[unsafe]
+fn tabbed_view_button_onclick(event_details EventDetails, mut app &Window, app_data voidptr){
+    unsafe {
+        mut button:=app.get_object_by_id(event_details.target_id)[0]
+        mut main_frame:=app.get_object_by_id(button["tabvw"].str)[0]
+        frame0:=app.get_object_by_id(main_frame["acttb"].str)[0]
+        frame1:=app.get_object_by_id(event_details.target_id.replace("@mui__tabs__",""))[0]
+        frame0["hi"].bol=true
+        frame1["hi"].bol=false
+        main_frame["acttb"]=frame1["id"]
+    }
+}
+
+[unsafe]
+pub fn add_tabbed_view(mut app &Window, id string, tabs [][]string, hidden bool, x string|int, y string|int, w string|int, h string|int,  frame string, zindex int, active_tab string){
+    unsafe {
+        app.frame( Widget{ id:id, x:x, y:y, width:w, height:h, hidden:hidden, frame:frame, z_index:zindex })
+        for which_tab,tab in tabs {
+            mut is_hidden:=true
+            if active_tab==tab[1]{
+                is_hidden=false
+                app.get_object_by_id(id)[0]["acttb"]=WindowData{str:tab[1]}
+            }
+            app.button( Widget{ id:"@mui__tabs__"+tab[1], text:tab[0] ,x:(100/tabs.len*which_tab).str()+"%x +2", y:2, width:(100/tabs.len).str()+"%x -4", height:26, onclick:tabbed_view_button_onclick, frame:id } )
+            app.get_object_by_id("@mui__tabs__"+tab[1])[0]["tabvw"]=WindowData{str:id}
+
+            app.frame( Widget{ id:tab[1], x:0, y:30, height:"100%y -30", width:"100%x", hidden:is_hidden, frame:id } )
+        }
+    }
+}

types.v

@@ -104,6 +104,8 @@ pub:
 	placeholder		string			//= ""										//ph
 	ph_as_text		bool			//= 0										//phsa //show placeholder as text
 	table			[][]string		= [[""]]									//table
+	tabs			[][]string		= [["Test Tab","test_tab"]]					//tabs
+	active_tab		string			//= ""										//acttb
 	id				string			//= ""										//id
 	link			string			//= ""										//link
 	percent			int				//= 0										//perc

widgets.v

@@ -83,3 +83,10 @@ pub fn (mut app Window) scrollbar ( args Widget ){ //dialog support not done
 pub fn (mut app Window) link ( args Widget ){ //dialog support not done
 	add_link (mut app, args.text, args.id, args.x, args.y, args.width, args.height, args.hidden, args.link_underline, args.link, app.color_scheme[3], args.onclick, args.frame, args.z_index)
 }
+
+[unsafe]
+pub fn (mut app Window) tab_view ( args Widget ){
+	unsafe {
+		add_tabbed_view (mut app, args.id, args.tabs, args.hidden, args.x, args.y, args.width, args.height, args.frame, args.z_index, args.active_tab)
+	}
+}