| // Copyright 2014 The Flutter Authors. All rights reserved. |
| // Use of this source code is governed by a BSD-style license that can be |
| // found in the LICENSE file. |
| |
| import 'package:flutter/material.dart'; |
| import '../../../layout/adaptive.dart'; |
| import '../colors.dart'; |
| |
| class TabWithSidebar extends StatelessWidget { |
| const TabWithSidebar({ |
| super.key, |
| this.restorationId, |
| required this.mainView, |
| required this.sidebarItems, |
| }); |
| |
| final Widget mainView; |
| final List<Widget> sidebarItems; |
| final String? restorationId; |
| |
| @override |
| Widget build(BuildContext context) { |
| if (isDisplayDesktop(context)) { |
| return Row( |
| children: <Widget>[ |
| Flexible( |
| flex: 2, |
| child: SingleChildScrollView( |
| child: Padding( |
| padding: const EdgeInsets.symmetric(vertical: 24), |
| child: mainView, |
| ), |
| ), |
| ), |
| Expanded( |
| child: Container( |
| color: RallyColors.inputBackground, |
| padding: const EdgeInsetsDirectional.only(start: 24), |
| height: double.infinity, |
| alignment: AlignmentDirectional.centerStart, |
| child: ListView( |
| shrinkWrap: true, |
| children: sidebarItems, |
| ), |
| ), |
| ), |
| ], |
| ); |
| } else { |
| return SingleChildScrollView( |
| restorationId: restorationId, |
| child: mainView, |
| ); |
| } |
| } |
| } |
| |
| class SidebarItem extends StatelessWidget { |
| const SidebarItem({ |
| super.key, |
| required this.value, |
| required this.title, |
| }); |
| |
| final String value; |
| final String title; |
| |
| @override |
| Widget build(BuildContext context) { |
| final TextTheme textTheme = Theme.of(context).textTheme; |
| return Column( |
| crossAxisAlignment: CrossAxisAlignment.start, |
| children: <Widget>[ |
| const SizedBox(height: 8), |
| SelectableText( |
| title, |
| style: textTheme.bodyMedium!.copyWith( |
| fontSize: 16, |
| color: RallyColors.gray60, |
| ), |
| ), |
| const SizedBox(height: 8), |
| SelectableText( |
| value, |
| style: textTheme.bodyLarge!.copyWith(fontSize: 20), |
| ), |
| const SizedBox(height: 8), |
| Container( |
| color: RallyColors.primaryBackground, |
| height: 1, |
| ), |
| ], |
| ); |
| } |
| } |