diff --git a/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/lib/src/widget_preview_rendering.dart b/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/lib/src/widget_preview_rendering.dart index 8687b72756..8449dd0ec5 100644 --- a/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/lib/src/widget_preview_rendering.dart +++ b/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/lib/src/widget_preview_rendering.dart @@ -413,8 +413,106 @@ Future mainImpl() async { runApp(_WidgetPreviewScaffold()); } +/// Define the Enum for Layout Types +enum LayoutType { gridView, listView } + class _WidgetPreviewScaffold extends StatelessWidget { - const _WidgetPreviewScaffold(); + // Positioning values for positioning the previewer + final double _previewLeftPadding = 60.0; + final double _previewRightPadding = 20.0; + + // Positioning values for the toggle layout buttons + final double _toggleButtonsTopPadding = 20.0; + final double _toggleButtonsLeftPadding = 20.0; + + // Spacing values for the grid layout + final double _gridSpacing = 8.0; + final double _gridRunSpacing = 8.0; + + // Notifier to manage layout state, default to GridView + final ValueNotifier _selectedLayout = ValueNotifier( + LayoutType.gridView, + ); + + // Function to toggle layouts based on enum value + void _toggleLayout(LayoutType layout) { + _selectedLayout.value = layout; + } + + Widget _buildGridViewFlex(List previewList) { + return SingleChildScrollView( + child: Wrap( + spacing: _gridSpacing, + runSpacing: _gridRunSpacing, + alignment: WrapAlignment.start, + children: [ + for (final WidgetPreview preview in previewList) + WidgetPreviewWidget(preview: preview), + ], + ), + ); + } + + Widget _buildVerticalListView(List previewList) { + return ListView.builder( + itemCount: previewList.length, + itemBuilder: (context, index) { + final preview = previewList[index]; + return Center(child: WidgetPreviewWidget(preview: preview)); + }, + ); + } + + Widget _displayToggleLayoutButtons() { + return Positioned( + top: _toggleButtonsTopPadding, + left: _toggleButtonsLeftPadding, + child: Container( + padding: EdgeInsets.all(8.0), + decoration: BoxDecoration( + color: Colors.grey[300], + borderRadius: BorderRadius.circular(8.0), + ), + child: Column( + children: [ + ValueListenableBuilder( + valueListenable: _selectedLayout, + builder: (context, selectedLayout, _) { + return Column( + children: [ + IconButton( + onPressed: () => _toggleLayout(LayoutType.gridView), + icon: Icon(Icons.grid_on), + color: + selectedLayout == LayoutType.gridView + ? Colors.blue + : Colors.black, + ), + IconButton( + onPressed: () => _toggleLayout(LayoutType.listView), + icon: Icon(Icons.view_list), + color: + selectedLayout == LayoutType.listView + ? Colors.blue + : Colors.black, + ), + ], + ); + }, + ), + ], + ), + ), + ); + } + + Widget _displayPreviewer(Widget previewView) { + return Positioned.fill( + left: _previewLeftPadding, + right: _previewRightPadding, + child: Container(padding: EdgeInsets.all(8.0), child: previewView), + ); + } @override Widget build(BuildContext context) { @@ -439,26 +537,34 @@ class _WidgetPreviewScaffold extends StatelessWidget { builder: (BuildContext context, BoxConstraints constraints) { return WidgetPreviewerWindowConstraints( constraints: constraints, - child: SingleChildScrollView( - child: Column( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - for (final WidgetPreview preview in previewList) - WidgetPreviewWidget(preview: preview), - ], - ), + child: ValueListenableBuilder( + valueListenable: _selectedLayout, + builder: (context, selectedLayout, _) { + return switch (selectedLayout) { + LayoutType.gridView => _buildGridViewFlex(previewList), + LayoutType.listView => _buildVerticalListView(previewList), + }; + }, ), ); }, ); } + return MaterialApp( debugShowCheckedModeBanner: false, home: Material( color: Colors.transparent, child: DefaultAssetBundle( bundle: PreviewAssetBundle(), - child: previewView, + child: Stack( + children: [ + // Display the previewer + _displayPreviewer(previewView), + // Display the layout toggle buttons + _displayToggleLayoutButtons(), + ], + ), ), ), ); diff --git a/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/pubspec.yaml b/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/pubspec.yaml index 696c849d8c..598273ede0 100644 --- a/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/pubspec.yaml +++ b/packages/flutter_tools/test/widget_preview_scaffold.shard/widget_preview_scaffold/pubspec.yaml @@ -4,7 +4,7 @@ publish_to: 'none' version: 0.0.1 environment: - sdk: ^3.8.0-244.0.dev + sdk: ^3.8.0-265.0.dev dependencies: flutter: