flutter_multi_split_layout 0.0.2
flutter_multi_split_layout: ^0.0.2 copied to clipboard
A Flutter widget for creating resizable multi-panel split layouts. Supports horizontal/vertical splitting, drag-to-resize dividers, and JSON serialization of layout state.
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:flutter_multi_split_layout/flutter_multi_split_layout.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Multi Split Layout Example',
theme: ThemeData(primarySwatch: Colors.blue),
home: const LayoutTestScreen(),
);
}
}
class LayoutTestScreen extends StatefulWidget {
const LayoutTestScreen({Key? key}) : super(key: key);
@override
State<LayoutTestScreen> createState() => _LayoutTestScreenState();
}
class _LayoutTestScreenState extends State<LayoutTestScreen> {
late LayoutController controller;
bool isAdminMode = true; // Flag to manage Admin or Client mode
@override
void initState() {
super.initState();
// Initialize the controller
controller = LayoutController();
}
void _printJson() {
// Convert model to JSON
final jsonMap = controller.toJson();
// Format beautifully (with indentation)
final prettyJson = const JsonEncoder.withIndent(' ').convert(jsonMap);
debugPrint('--- JSON ready to send (For Server) ---');
debugPrint(prettyJson);
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(
content: Text('JSON printed to console. Check the terminal!'),
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Screen Management'),
actions: [
Row(
children: [
const Text(
'Client',
style: TextStyle(fontWeight: FontWeight.bold),
),
Switch(
value: isAdminMode,
activeColor: Colors.white,
onChanged: (value) {
setState(() {
isAdminMode = value;
});
},
),
const Text(
'Admin',
style: TextStyle(fontWeight: FontWeight.bold),
),
],
),
const SizedBox(width: 20),
IconButton(
icon: const Icon(Icons.data_object),
tooltip: 'View JSON',
onPressed: _printJson,
),
const SizedBox(width: 16),
],
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: MultiSplitLayout(
controller: controller,
isEditable: isAdminMode,
itemBuilder: (context, contentId) {
return Container(
color: Colors.blueGrey.shade50,
child: Center(
child: Text(
contentId ?? 'No resource',
textAlign: TextAlign.center,
style: const TextStyle(color: Colors.black54),
),
),
);
},
),
),
);
}
}