mirror of
https://github.com/vodemn/m3_lightmeter.git
synced 2024-11-23 16:00:41 +00:00
unified components elevation
This commit is contained in:
parent
2a518f0ace
commit
4a27c27270
5 changed files with 27 additions and 8 deletions
|
@ -7,6 +7,11 @@ class Dimens {
|
||||||
static const double borderRadiusL = 24;
|
static const double borderRadiusL = 24;
|
||||||
static const double borderRadiusXL = 32;
|
static const double borderRadiusXL = 32;
|
||||||
|
|
||||||
|
static const double elevationLevel0 = 0;
|
||||||
|
static const double elevationLevel1 = 1;
|
||||||
|
static const double elevationLevel2 = 3;
|
||||||
|
static const double elevationLevel3 = 6;
|
||||||
|
|
||||||
static const double grid4 = 4;
|
static const double grid4 = 4;
|
||||||
static const double grid8 = 8;
|
static const double grid8 = 8;
|
||||||
static const double grid16 = 16;
|
static const double grid16 = 16;
|
||||||
|
|
|
@ -29,15 +29,16 @@ ThemeData themeFrom(Color primaryColor, Brightness brightness) {
|
||||||
primaryColor: primaryColor,
|
primaryColor: primaryColor,
|
||||||
colorScheme: scheme,
|
colorScheme: scheme,
|
||||||
appBarTheme: AppBarTheme(
|
appBarTheme: AppBarTheme(
|
||||||
elevation: 4,
|
elevation: Dimens.elevationLevel0,
|
||||||
color: scheme.background,
|
scrolledUnderElevation: Dimens.elevationLevel2,
|
||||||
|
color: scheme.surface,
|
||||||
foregroundColor: scheme.onBackground,
|
foregroundColor: scheme.onBackground,
|
||||||
surfaceTintColor: scheme.surfaceTint,
|
surfaceTintColor: scheme.surfaceTint,
|
||||||
),
|
),
|
||||||
cardTheme: CardTheme(
|
cardTheme: CardTheme(
|
||||||
clipBehavior: Clip.antiAlias,
|
clipBehavior: Clip.antiAlias,
|
||||||
color: scheme.surface,
|
color: scheme.surface,
|
||||||
elevation: 4,
|
elevation: Dimens.elevationLevel1,
|
||||||
margin: EdgeInsets.zero,
|
margin: EdgeInsets.zero,
|
||||||
shadowColor: Colors.transparent,
|
shadowColor: Colors.transparent,
|
||||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(Dimens.borderRadiusL)),
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(Dimens.borderRadiusL)),
|
||||||
|
@ -47,7 +48,7 @@ ThemeData themeFrom(Color primaryColor, Brightness brightness) {
|
||||||
dialogTheme: DialogTheme(
|
dialogTheme: DialogTheme(
|
||||||
backgroundColor: scheme.surface,
|
backgroundColor: scheme.surface,
|
||||||
surfaceTintColor: scheme.surfaceTint,
|
surfaceTintColor: scheme.surfaceTint,
|
||||||
elevation: 6,
|
elevation: Dimens.elevationLevel3,
|
||||||
),
|
),
|
||||||
dividerColor: scheme.outlineVariant,
|
dividerColor: scheme.outlineVariant,
|
||||||
dividerTheme: DividerThemeData(
|
dividerTheme: DividerThemeData(
|
||||||
|
@ -59,7 +60,7 @@ ThemeData themeFrom(Color primaryColor, Brightness brightness) {
|
||||||
iconColor: scheme.onSurface,
|
iconColor: scheme.onSurface,
|
||||||
textColor: scheme.onSurface,
|
textColor: scheme.onSurface,
|
||||||
),
|
),
|
||||||
scaffoldBackgroundColor: scheme.background,
|
scaffoldBackgroundColor: scheme.surface,
|
||||||
);
|
);
|
||||||
return theme.copyWith(
|
return theme.copyWith(
|
||||||
listTileTheme: ListTileThemeData(
|
listTileTheme: ListTileThemeData(
|
||||||
|
@ -102,3 +103,13 @@ ColorScheme _colorSchemeFromColor(Color primaryColor, Brightness brightness) {
|
||||||
outlineVariant: Color(scheme.outlineVariant),
|
outlineVariant: Color(scheme.outlineVariant),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
extension ElevatedSurfaceTheme on ColorScheme {
|
||||||
|
Color _surfaceWithElevation(double elevation) {
|
||||||
|
return ElevationOverlay.applySurfaceTint(surface, surfaceTint, elevation);
|
||||||
|
}
|
||||||
|
|
||||||
|
Color get surfaceElevated1 => _surfaceWithElevation(Dimens.elevationLevel1);
|
||||||
|
Color get surfaceElevated2 => _surfaceWithElevation(Dimens.elevationLevel2);
|
||||||
|
Color get surfaceElevated3 => _surfaceWithElevation(Dimens.elevationLevel3);
|
||||||
|
}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:lightmeter/res/dimens.dart';
|
import 'package:lightmeter/res/dimens.dart';
|
||||||
|
import 'package:lightmeter/res/theme.dart';
|
||||||
import 'package:lightmeter/screens/metering/components/shared/metering_top_bar/shape_top_bar_metering.dart';
|
import 'package:lightmeter/screens/metering/components/shared/metering_top_bar/shape_top_bar_metering.dart';
|
||||||
import 'package:lightmeter/screens/metering/components/shared/readings_container/widget_container_readings.dart';
|
import 'package:lightmeter/screens/metering/components/shared/readings_container/widget_container_readings.dart';
|
||||||
|
|
||||||
|
@ -19,7 +20,7 @@ class MeteringTopBar extends StatelessWidget {
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return CustomPaint(
|
return CustomPaint(
|
||||||
painter: MeteringTopBarShape(
|
painter: MeteringTopBarShape(
|
||||||
color: Theme.of(context).colorScheme.surface,
|
color: Theme.of(context).colorScheme.surfaceElevated1,
|
||||||
appendixWidth: MediaQuery.of(context).size.width / 2 - Dimens.grid8 / 2 + Dimens.paddingM,
|
appendixWidth: MediaQuery.of(context).size.width / 2 - Dimens.grid8 / 2 + Dimens.paddingM,
|
||||||
appendixHeight: appendixHeight,
|
appendixHeight: appendixHeight,
|
||||||
),
|
),
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:lightmeter/res/dimens.dart';
|
import 'package:lightmeter/res/dimens.dart';
|
||||||
|
import 'package:lightmeter/res/theme.dart';
|
||||||
|
|
||||||
class BottomControlsBar extends StatelessWidget {
|
class BottomControlsBar extends StatelessWidget {
|
||||||
final Widget center;
|
final Widget center;
|
||||||
|
@ -33,7 +34,7 @@ class BottomControlsBar extends StatelessWidget {
|
||||||
topRight: Radius.circular(Dimens.borderRadiusL),
|
topRight: Radius.circular(Dimens.borderRadiusL),
|
||||||
),
|
),
|
||||||
child: ColoredBox(
|
child: ColoredBox(
|
||||||
color: Theme.of(context).colorScheme.surface,
|
color: Theme.of(context).colorScheme.surfaceElevated1,
|
||||||
child: SafeArea(
|
child: SafeArea(
|
||||||
top: false,
|
top: false,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
|
|
|
@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
|
||||||
import 'package:lightmeter/data/models/exposure_pair.dart';
|
import 'package:lightmeter/data/models/exposure_pair.dart';
|
||||||
import 'package:lightmeter/generated/l10n.dart';
|
import 'package:lightmeter/generated/l10n.dart';
|
||||||
import 'package:lightmeter/res/dimens.dart';
|
import 'package:lightmeter/res/dimens.dart';
|
||||||
|
import 'package:lightmeter/res/theme.dart';
|
||||||
import 'package:lightmeter/screens/metering/components/shared/readings_container/components/shared/reading_value_container/widget_container_reading_value.dart';
|
import 'package:lightmeter/screens/metering/components/shared/readings_container/components/shared/reading_value_container/widget_container_reading_value.dart';
|
||||||
import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
|
import 'package:m3_lightmeter_resources/m3_lightmeter_resources.dart';
|
||||||
|
|
||||||
|
@ -21,7 +22,7 @@ class TimerMeteringConfig extends StatelessWidget {
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Container(
|
return Container(
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: Theme.of(context).colorScheme.surface,
|
color: Theme.of(context).colorScheme.surfaceElevated1,
|
||||||
borderRadius: const BorderRadius.only(
|
borderRadius: const BorderRadius.only(
|
||||||
bottomLeft: Radius.circular(Dimens.borderRadiusL),
|
bottomLeft: Radius.circular(Dimens.borderRadiusL),
|
||||||
bottomRight: Radius.circular(Dimens.borderRadiusL),
|
bottomRight: Radius.circular(Dimens.borderRadiusL),
|
||||||
|
|
Loading…
Reference in a new issue