Skip to content

Commit

Permalink
Added list layout label positioning
Browse files Browse the repository at this point in the history
  • Loading branch information
@Gold872
Gold872 committed Nov 8, 2023
1 parent 71e1676 commit c7c249e
Show file tree
Hide file tree
Showing 2 changed files with 159 additions and 33 deletions.
7 changes: 7 additions & 0 deletions lib/widgets/draggable_containers/draggable_layout_container.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -38,13 +39,19 @@ abstract class DraggableLayoutContainer extends DraggableWidgetContainer {
}) : super.fromJson();

@override
@mustCallSuper
Map<String, dynamic> toJson() {
return {
...super.toJson(),
'type': type,
'properties': getProperties(),
};
}

Map<String, dynamic> getProperties() {
return {};
}

bool willAcceptWidget(DraggableWidgetContainer widget,
{Offset? globalPosition});

Expand Down
185 changes: 152 additions & 33 deletions lib/widgets/draggable_containers/draggable_list_layout.dart
View file
Original file line number Diff line number Diff line change
@@ -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';
Expand All @@ -13,6 +16,8 @@ class DraggableListLayout extends DraggableLayoutContainer {

List<DraggableNT4WidgetContainer> children = [];

String labelPosition = 'TOP';

DraggableListLayout({
super.key,
required super.dashboardGrid,
Expand All @@ -25,6 +30,7 @@ class DraggableListLayout extends DraggableLayoutContainer {
super.onDragCancel,
super.onResizeBegin,
super.onResizeEnd,
this.labelPosition = 'TOP',
}) : super();

DraggableListLayout.fromJson({
Expand Down Expand Up @@ -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(
Expand Down Expand Up @@ -188,6 +219,13 @@ class DraggableListLayout extends DraggableLayoutContainer {
void fromJson(Map<String, dynamic> jsonData) {
super.fromJson(jsonData);

if (jsonData.containsKey('properties') &&
jsonData['properties'] is Map<String, dynamic>) {
labelPosition = tryCast(jsonData['properties']['label_position']) ??
tryCast(jsonData['properties']['Label position']) ??
'TOP';
}

for (Map<String, dynamic> childData in jsonData['children']) {
children.add(nt4ContainerBuilder?.call(childData) ??
DraggableNT4WidgetContainer.fromJson(
Expand All @@ -209,6 +247,13 @@ class DraggableListLayout extends DraggableLayoutContainer {
};
}

@override
Map<String, dynamic> getProperties() {
return {
'label_position': labelPosition,
};
}

@override
void dispose({bool deleting = false}) {
super.dispose(deleting: deleting);
Expand Down Expand Up @@ -253,6 +298,112 @@ class DraggableListLayout extends DraggableLayoutContainer {
List<Widget> 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
Expand Down Expand Up @@ -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,
),
),
),
Expand Down

0 comments on commit c7c249e

Please sign in to comment.