diff --git a/lib/widgets/draggable_containers/draggable_layout_container.dart b/lib/widgets/draggable_containers/draggable_layout_container.dart index 5eed8295..269877f0 100644 --- a/lib/widgets/draggable_containers/draggable_layout_container.dart +++ b/lib/widgets/draggable_containers/draggable_layout_container.dart @@ -2,6 +2,7 @@ import 'dart:ui'; import 'package:elastic_dashboard/widgets/draggable_containers/draggable_nt4_widget_container.dart'; import 'package:elastic_dashboard/widgets/draggable_containers/draggable_widget_container.dart'; +import 'package:flutter/foundation.dart'; abstract class DraggableLayoutContainer extends DraggableWidgetContainer { String get type; @@ -38,13 +39,19 @@ abstract class DraggableLayoutContainer extends DraggableWidgetContainer { }) : super.fromJson(); @override + @mustCallSuper Map toJson() { return { ...super.toJson(), 'type': type, + 'properties': getProperties(), }; } + Map getProperties() { + return {}; + } + bool willAcceptWidget(DraggableWidgetContainer widget, {Offset? globalPosition}); diff --git a/lib/widgets/draggable_containers/draggable_list_layout.dart b/lib/widgets/draggable_containers/draggable_list_layout.dart index 53571920..708069c8 100644 --- a/lib/widgets/draggable_containers/draggable_list_layout.dart +++ b/lib/widgets/draggable_containers/draggable_list_layout.dart @@ -1,6 +1,9 @@ +import 'dart:convert'; import 'dart:ui'; import 'package:collection/collection.dart'; +import 'package:dot_cast/dot_cast.dart'; +import 'package:elastic_dashboard/widgets/dialog_widgets/dialog_dropdown_chooser.dart'; import 'package:elastic_dashboard/widgets/dialog_widgets/dialog_text_input.dart'; import 'package:elastic_dashboard/widgets/draggable_containers/draggable_layout_container.dart'; import 'package:elastic_dashboard/widgets/draggable_containers/draggable_nt4_widget_container.dart'; @@ -13,6 +16,8 @@ class DraggableListLayout extends DraggableLayoutContainer { List children = []; + String labelPosition = 'TOP'; + DraggableListLayout({ super.key, required super.dashboardGrid, @@ -25,6 +30,7 @@ class DraggableListLayout extends DraggableLayoutContainer { super.onDragCancel, super.onResizeBegin, super.onResizeEnd, + this.labelPosition = 'TOP', }) : super(); DraggableListLayout.fromJson({ @@ -59,6 +65,31 @@ class DraggableListLayout extends DraggableLayoutContainer { children: [ ...getContainerEditProperties(), const Divider(), + const Center( + child: Text('Label Position'), + ), + DialogDropdownChooser( + onSelectionChanged: (value) { + if (value == null) { + return; + } + + setState(() { + labelPosition = value.toUpperCase(); + + refresh(); + }); + }, + choices: const [ + 'Top', + 'Left', + 'Right', + 'Bottom', + 'Hidden', + ], + initialValue: labelPosition, + ), + const Divider(), if (children.isNotEmpty) Container( constraints: const BoxConstraints( @@ -188,6 +219,13 @@ class DraggableListLayout extends DraggableLayoutContainer { void fromJson(Map jsonData) { super.fromJson(jsonData); + if (jsonData.containsKey('properties') && + jsonData['properties'] is Map) { + labelPosition = tryCast(jsonData['properties']['label_position']) ?? + tryCast(jsonData['properties']['Label position']) ?? + 'TOP'; + } + for (Map childData in jsonData['children']) { children.add(nt4ContainerBuilder?.call(childData) ?? DraggableNT4WidgetContainer.fromJson( @@ -209,6 +247,13 @@ class DraggableListLayout extends DraggableLayoutContainer { }; } + @override + Map getProperties() { + return { + 'label_position': labelPosition, + }; + } + @override void dispose({bool deleting = false}) { super.dispose(deleting: deleting); @@ -253,6 +298,112 @@ class DraggableListLayout extends DraggableLayoutContainer { List column = []; for (DraggableNT4WidgetContainer widget in children) { + Widget widgetInContainer = Container( + constraints: BoxConstraints( + maxHeight: (widget.minHeight ?? 128.0) - 64.0, + ), + child: Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Flexible( + child: Padding( + padding: + const EdgeInsets.symmetric(horizontal: 1.5, vertical: 2.5), + child: widget.child!, + ), + ), + ], + ), + ); + + Widget containerContent; + + switch (labelPosition.toUpperCase()) { + case 'LEFT': + containerContent = Row( + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Align( + alignment: Alignment.centerLeft, + child: Padding( + padding: const EdgeInsets.only(left: 2.0), + child: Text( + widget.title ?? '', + overflow: TextOverflow.ellipsis, + ), + ), + ), + Flexible( + child: widgetInContainer, + ), + ], + ); + break; + case 'RIGHT': + containerContent = Row( + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Flexible( + child: widgetInContainer, + ), + Align( + alignment: Alignment.centerRight, + child: Padding( + padding: const EdgeInsets.only(left: 2.0), + child: Text( + widget.title ?? '', + overflow: TextOverflow.ellipsis, + ), + ), + ), + ], + ); + break; + case 'BOTTOM': + containerContent = Column( + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + widgetInContainer, + Align( + alignment: Alignment.bottomLeft, + child: Padding( + padding: const EdgeInsets.only(left: 2.0), + child: Text( + widget.title ?? '', + overflow: TextOverflow.ellipsis, + ), + ), + ), + ], + ); + break; + case 'HIDDEN': + containerContent = widgetInContainer; + case 'TOP': + default: + containerContent = Column( + mainAxisAlignment: MainAxisAlignment.start, + mainAxisSize: MainAxisSize.min, + children: [ + Align( + alignment: Alignment.topLeft, + child: Padding( + padding: const EdgeInsets.only(left: 2.0), + child: Text( + widget.title ?? '', + overflow: TextOverflow.ellipsis, + ), + ), + ), + widgetInContainer, + ], + ); + break; + } + column.add( GestureDetector( supportedDevices: PointerDeviceKind.values @@ -325,39 +476,7 @@ class DraggableListLayout extends DraggableLayoutContainer { ), ], ), - child: Column( - mainAxisAlignment: MainAxisAlignment.start, - mainAxisSize: MainAxisSize.min, - children: [ - Align( - alignment: Alignment.topLeft, - child: Padding( - padding: const EdgeInsets.only(left: 2.0), - child: Text( - widget.title ?? '', - overflow: TextOverflow.ellipsis, - ), - ), - ), - Container( - constraints: BoxConstraints( - maxHeight: (widget.minHeight ?? 128.0) - 64.0, - ), - child: Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Flexible( - child: Padding( - padding: const EdgeInsets.symmetric( - horizontal: 1.5, vertical: 2.5), - child: widget.child!, - ), - ), - ], - ), - ), - ], - ), + child: containerContent, ), ), ),