Add object tool panel mockup
This commit is contained in:
		
							parent
							
								
									08a337d26d
								
							
						
					
					
						commit
						dfcf3ebbd3
					
				|  | @ -2,6 +2,7 @@ import { Theme } from "theme.slint"; | ||||||
| import { EditorBar } from "editor_bar.slint"; | import { EditorBar } from "editor_bar.slint"; | ||||||
| import { StatusBar } from "status_bar.slint"; | import { StatusBar } from "status_bar.slint"; | ||||||
| import { ToolBar } from "tool_bar.slint"; | import { ToolBar } from "tool_bar.slint"; | ||||||
|  | import { ObjectToolPanel } from "object_tool_panel.slint"; | ||||||
| 
 | 
 | ||||||
| export component AppWindow inherits Window { | export component AppWindow inherits Window { | ||||||
|     title: @tr("FM Editor"); |     title: @tr("FM Editor"); | ||||||
|  | @ -11,8 +12,20 @@ export component AppWindow inherits Window { | ||||||
|         EditorBar { } |         EditorBar { } | ||||||
| 
 | 
 | ||||||
|         HorizontalLayout { |         HorizontalLayout { | ||||||
|             alignment: start; |  | ||||||
|             ToolBar { } |             ToolBar { } | ||||||
|  | 
 | ||||||
|  |             ObjectToolPanel { } | ||||||
|  | 
 | ||||||
|  |             Rectangle { | ||||||
|  |                 Text { | ||||||
|  |                     font-size: Theme.font-lg; | ||||||
|  |                     text: "INSERT VIEWPORT HERE"; | ||||||
|  |                     vertical-alignment: center; | ||||||
|  |                     horizontal-alignment: center; | ||||||
|  |                 } | ||||||
|  |             } | ||||||
|  | 
 | ||||||
|  |             ObjectToolPanel { } | ||||||
|         } |         } | ||||||
| 
 | 
 | ||||||
|         StatusBar { } |         StatusBar { } | ||||||
|  |  | ||||||
|  | @ -0,0 +1,252 @@ | ||||||
|  | import { Theme } from "theme.slint"; | ||||||
|  | 
 | ||||||
|  | export component ObjectToolPanel inherits Rectangle { | ||||||
|  |     width: 280px; | ||||||
|  |     border-color: black; | ||||||
|  |     border-width: 1px; | ||||||
|  | 
 | ||||||
|  |     VerticalLayout { | ||||||
|  |         padding: Theme.padding-md; | ||||||
|  |         spacing: Theme.spacing-md; | ||||||
|  | 
 | ||||||
|  |         HorizontalLayout { | ||||||
|  |             height: Theme.size-md; | ||||||
|  |             Text { | ||||||
|  |                 font-size: Theme.font-lg; | ||||||
|  |                 text: @tr("Object Tool"); | ||||||
|  |                 vertical-alignment: center; | ||||||
|  |             } | ||||||
|  |         } | ||||||
|  | 
 | ||||||
|  |         Rectangle { | ||||||
|  |             border-color: black; | ||||||
|  |             border-width: 1px; | ||||||
|  |             border-radius: Theme.radius-md; | ||||||
|  |             clip: true; | ||||||
|  | 
 | ||||||
|  |             VerticalLayout { | ||||||
|  |                 Rectangle { | ||||||
|  |                     height: Theme.size-md; | ||||||
|  |                     border-color: black; | ||||||
|  |                     border-width: 1px; | ||||||
|  |                     HorizontalLayout { | ||||||
|  |                         padding-left: Theme.padding-md; | ||||||
|  |                         padding-right: Theme.padding-md; | ||||||
|  |                         Text { | ||||||
|  |                             font-size: Theme.font-md; | ||||||
|  |                             text: @tr("Favourites"); | ||||||
|  |                             vertical-alignment: center; | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  |                 } | ||||||
|  | 
 | ||||||
|  |                 VerticalLayout { | ||||||
|  |                     padding: Theme.padding-md; | ||||||
|  |                     spacing: Theme.spacing-md; | ||||||
|  | 
 | ||||||
|  |                     Rectangle { | ||||||
|  |                         border-color: black; | ||||||
|  |                         border-width: 1px; | ||||||
|  |                         border-radius: Theme.radius-md; | ||||||
|  |                         clip: true; | ||||||
|  |                         VerticalLayout { | ||||||
|  |                             Rectangle { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 border-color: black; | ||||||
|  |                                 border-width: 1px; | ||||||
|  |                                 HorizontalLayout { | ||||||
|  |                                     padding-left: Theme.padding-md; | ||||||
|  |                                     padding-right: Theme.padding-md; | ||||||
|  |                                     Text { | ||||||
|  |                                         font-size: Theme.font-md; | ||||||
|  |                                         text: "Group Name"; | ||||||
|  |                                         vertical-alignment: center; | ||||||
|  |                                         horizontal-alignment: center; | ||||||
|  |                                     } | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  |                 } | ||||||
|  | 
 | ||||||
|  |                 VerticalLayout { | ||||||
|  |                     padding: Theme.padding-md; | ||||||
|  |                     spacing: Theme.spacing-md; | ||||||
|  | 
 | ||||||
|  |                     Rectangle { | ||||||
|  |                         border-color: black; | ||||||
|  |                         border-width: 1px; | ||||||
|  |                         border-radius: Theme.radius-md; | ||||||
|  |                         clip: true; | ||||||
|  |                         VerticalLayout { | ||||||
|  |                             Rectangle { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 border-color: black; | ||||||
|  |                                 border-width: 1px; | ||||||
|  |                                 HorizontalLayout { | ||||||
|  |                                     padding-left: Theme.padding-md; | ||||||
|  |                                     padding-right: Theme.padding-md; | ||||||
|  |                                     Text { | ||||||
|  |                                         font-size: Theme.font-md; | ||||||
|  |                                         text: "Group Name"; | ||||||
|  |                                         vertical-alignment: center; | ||||||
|  |                                         horizontal-alignment: center; | ||||||
|  |                                     } | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  | 
 | ||||||
|  |                             HorizontalLayout { | ||||||
|  |                                 height: Theme.size-md; | ||||||
|  |                                 padding-left: Theme.padding-md; | ||||||
|  |                                 padding-right: Theme.padding-md; | ||||||
|  |                                 Text { | ||||||
|  |                                     font-size: Theme.font-md; | ||||||
|  |                                     text: "Object Name"; | ||||||
|  |                                     vertical-alignment: center; | ||||||
|  |                                 } | ||||||
|  |                             } | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  |                 } | ||||||
|  |             } | ||||||
|  |         } | ||||||
|  | 
 | ||||||
|  |         Rectangle { | ||||||
|  |             border-color: black; | ||||||
|  |             border-width: 1px; | ||||||
|  |             border-radius: Theme.radius-md; | ||||||
|  |             clip: true; | ||||||
|  | 
 | ||||||
|  |             VerticalLayout { | ||||||
|  | 
 | ||||||
|  |                 Rectangle { | ||||||
|  |                     height: Theme.size-md; | ||||||
|  |                     border-color: black; | ||||||
|  |                     border-width: 1px; | ||||||
|  |                     HorizontalLayout { | ||||||
|  |                         padding-left: Theme.padding-md; | ||||||
|  |                         padding-right: Theme.padding-md; | ||||||
|  |                         Text { | ||||||
|  |                             font-size: Theme.font-md; | ||||||
|  |                             text: @tr("Hierarchy"); | ||||||
|  |                             vertical-alignment: center; | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  |                 } | ||||||
|  | 
 | ||||||
|  |                 VerticalLayout { | ||||||
|  |                     padding: Theme.padding-md; | ||||||
|  |                     spacing: Theme.spacing-md; | ||||||
|  | 
 | ||||||
|  |                     HorizontalLayout { | ||||||
|  |                         spacing: Theme.spacing-md; | ||||||
|  |                         height: Theme.size-md; | ||||||
|  |                         Text { | ||||||
|  |                             font-size: Theme.font-md; | ||||||
|  |                             vertical-alignment: center; | ||||||
|  |                             text: @tr("Name:"); | ||||||
|  |                         } | ||||||
|  | 
 | ||||||
|  |                         Rectangle { | ||||||
|  |                             border-color: black; | ||||||
|  |                             border-width: 1px; | ||||||
|  |                             border-radius: Theme.radius-md; | ||||||
|  | 
 | ||||||
|  |                             Text { | ||||||
|  |                                 font-size: Theme.font-md; | ||||||
|  |                                 vertical-alignment: center; | ||||||
|  |                                 horizontal-alignment: left; | ||||||
|  |                                 text: "VicHutch (-514)"; | ||||||
|  |                             } | ||||||
|  |                         } | ||||||
|  | 
 | ||||||
|  |                         Rectangle { | ||||||
|  |                             border-color: black; | ||||||
|  |                             border-width: 1px; | ||||||
|  |                             border-radius: Theme.radius-md; | ||||||
|  | 
 | ||||||
|  |                             width: Theme.size-md; | ||||||
|  |                         } | ||||||
|  | 
 | ||||||
|  |                         Rectangle { | ||||||
|  |                             border-color: black; | ||||||
|  |                             border-width: 1px; | ||||||
|  |                             border-radius: Theme.radius-md; | ||||||
|  | 
 | ||||||
|  |                             width: Theme.size-md; | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  | 
 | ||||||
|  |                     Rectangle { | ||||||
|  |                         border-color: black; | ||||||
|  |                         border-width: 1px; | ||||||
|  |                         border-radius: Theme.radius-md; | ||||||
|  |                         clip: true; | ||||||
|  | 
 | ||||||
|  |                         Text { | ||||||
|  |                             font-size: Theme.font-lg; | ||||||
|  |                             text: "INSERT TREE VIEW HERE"; | ||||||
|  |                             vertical-alignment: center; | ||||||
|  |                             horizontal-alignment: center; | ||||||
|  |                         } | ||||||
|  |                     } | ||||||
|  |                 } | ||||||
|  |             } | ||||||
|  |         } | ||||||
|  |     } | ||||||
|  | } | ||||||
		Loading…
	
		Reference in New Issue