tv: improved view config dialog in landscape
This commit is contained in:
Thibault Deckers
parent
0e4fbdade2
commit
a1990e44ae
2 changed files with 66 additions and 42 deletions
|
|
@ -3,6 +3,7 @@ import 'dart:ui';
|
||||||
import 'package:aves/model/settings/settings.dart';
|
import 'package:aves/model/settings/settings.dart';
|
||||||
import 'package:aves/widgets/common/extensions/build_context.dart';
|
import 'package:aves/widgets/common/extensions/build_context.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:provider/provider.dart';
|
||||||
|
|
||||||
class AvesDialog extends StatelessWidget {
|
class AvesDialog extends StatelessWidget {
|
||||||
static const confirmationRouteName = '/dialog/confirmation';
|
static const confirmationRouteName = '/dialog/confirmation';
|
||||||
|
|
@ -103,7 +104,7 @@ class AvesDialog extends StatelessWidget {
|
||||||
// workaround because the dialog tries
|
// workaround because the dialog tries
|
||||||
// to size itself to the content intrinsic size,
|
// to size itself to the content intrinsic size,
|
||||||
// but the `ListView` viewport does not have one
|
// but the `ListView` viewport does not have one
|
||||||
width: 1,
|
width: context.select<MediaQueryData, double>((mq) => mq.size.width / 2),
|
||||||
child: DecoratedBox(
|
child: DecoratedBox(
|
||||||
decoration: contentDecoration(context),
|
decoration: contentDecoration(context),
|
||||||
child: child,
|
child: child,
|
||||||
|
|
|
||||||
|
|
@ -172,53 +172,76 @@ class _TileViewDialogState<S, G, L> extends State<TileViewDialog<S, G, L>> with
|
||||||
}) {
|
}) {
|
||||||
if (options.isEmpty || !show) return const SizedBox();
|
if (options.isEmpty || !show) return const SizedBox();
|
||||||
|
|
||||||
|
final label = ConstrainedBox(
|
||||||
|
constraints: const BoxConstraints(minHeight: kMinInteractiveDimension),
|
||||||
|
child: Row(
|
||||||
|
children: [
|
||||||
|
Icon(icon),
|
||||||
|
const SizedBox(width: 16),
|
||||||
|
Expanded(
|
||||||
|
child: HighlightTitle(
|
||||||
|
title: title,
|
||||||
|
showHighlight: false,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
if (trailing != null) trailing,
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
final selector = TextDropdownButton<T>(
|
||||||
|
values: options.map((v) => v.value).toList(),
|
||||||
|
valueText: (v) => options.firstWhere((option) => option.value == v).title,
|
||||||
|
valueIcon: (v) => options.firstWhere((option) => option.value == v).icon,
|
||||||
|
value: value,
|
||||||
|
onChanged: (v) => setState(() => onChanged(v)),
|
||||||
|
isExpanded: true,
|
||||||
|
dropdownColor: Themes.thirdLayerColor(context),
|
||||||
|
);
|
||||||
|
|
||||||
final iconSize = IconTheme.of(context).size! * MediaQuery.textScaleFactorOf(context);
|
final iconSize = IconTheme.of(context).size! * MediaQuery.textScaleFactorOf(context);
|
||||||
|
final isPortrait = context.select<MediaQueryData, Orientation>((mq) => mq.orientation) == Orientation.portrait;
|
||||||
|
final child = isPortrait
|
||||||
|
? Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
label,
|
||||||
|
Padding(
|
||||||
|
padding: EdgeInsetsDirectional.only(start: iconSize + 16, end: 12),
|
||||||
|
child: selector,
|
||||||
|
),
|
||||||
|
if (bottom != null)
|
||||||
|
Padding(
|
||||||
|
padding: EdgeInsetsDirectional.only(start: iconSize + 16),
|
||||||
|
child: bottom,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
)
|
||||||
|
: Row(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Expanded(child: label),
|
||||||
|
const SizedBox(width: 8),
|
||||||
|
Expanded(
|
||||||
|
child: Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
selector,
|
||||||
|
if (bottom != null) bottom,
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
|
||||||
return TooltipTheme(
|
return TooltipTheme(
|
||||||
data: TooltipTheme.of(context).copyWith(
|
data: TooltipTheme.of(context).copyWith(
|
||||||
preferBelow: false,
|
preferBelow: false,
|
||||||
),
|
),
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
padding: const EdgeInsets.only(left: 16, top: 8, right: 16),
|
||||||
child: Column(
|
child: child,
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
children: [
|
|
||||||
const SizedBox(height: 8),
|
|
||||||
ConstrainedBox(
|
|
||||||
constraints: const BoxConstraints(minHeight: kMinInteractiveDimension),
|
|
||||||
child: Row(
|
|
||||||
children: [
|
|
||||||
Icon(icon),
|
|
||||||
const SizedBox(width: 16),
|
|
||||||
Expanded(
|
|
||||||
child: HighlightTitle(
|
|
||||||
title: title,
|
|
||||||
showHighlight: false,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (trailing != null) trailing,
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Padding(
|
|
||||||
padding: EdgeInsetsDirectional.only(start: iconSize + 16, end: 12),
|
|
||||||
child: TextDropdownButton<T>(
|
|
||||||
values: options.map((v) => v.value).toList(),
|
|
||||||
valueText: (v) => options.firstWhere((option) => option.value == v).title,
|
|
||||||
valueIcon: (v) => options.firstWhere((option) => option.value == v).icon,
|
|
||||||
value: value,
|
|
||||||
onChanged: (v) => setState(() => onChanged(v)),
|
|
||||||
isExpanded: true,
|
|
||||||
dropdownColor: Themes.thirdLayerColor(context),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
if (bottom != null)
|
|
||||||
Padding(
|
|
||||||
padding: EdgeInsetsDirectional.only(start: iconSize + 16),
|
|
||||||
child: bottom,
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue