e21db87817
Fix [Add `CircularProgressIndicator` padding to match M3 specs](https://github.com/flutter/flutter/issues/159267) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( body: Center( child: Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Container( width: 40, height: 40, color: Colors.red, alignment: Alignment.center, child: const Text( '40x40px', style: TextStyle(fontSize: 8, color: Colors.white), ), ), const ColoredBox( color: Colors.amber, child: CircularProgressIndicator( year2023: false, value: 0.4, ), ), Container( width: 48, height: 48, color: Colors.red, alignment: Alignment.center, child: const Text( '48x48px', style: TextStyle(fontSize: 10, color: Colors.white), ), ) ], ), ), ), ); } } ``` </details> ### Preview <img width="454" alt="Screenshot 2024-11-21 at 17 13 25" src="https://github.com/user-attachments/assets/6f7520f1-a213-4814-8116-6dd996639eec"> ### Specs  ## Pre-launch Checklist - [x] I read the [Contributor Guide] and followed the process outlined there for submitting PRs. - [x] I read the [Tree Hygiene] wiki page, which explains my responsibilities. - [x] I read and followed the [Flutter Style Guide], including [Features we expect every widget to implement]. - [x] I signed the [CLA]. - [x] I listed at least one issue that this PR fixes in the description above. - [x] I updated/added relevant documentation (doc comments with `///`). - [x] I added new tests to check the change I am making, or this PR is [test-exempt]. - [ ] I followed the [breaking change policy] and added [Data Driven Fixes] where supported. - [x] All existing and new tests are passing. If you need help, consider asking for advice on the #hackers-new channel on [Discord]. <!-- Links --> [Contributor Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#overview [Tree Hygiene]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md [test-exempt]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#tests [Flutter Style Guide]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md [Features we expect every widget to implement]: https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md#features-we-expect-every-widget-to-implement [CLA]: https://cla.developers.google.com/ [flutter/tests]: https://github.com/flutter/tests [breaking change policy]: https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#handling-breaking-changes [Discord]: https://github.com/flutter/flutter/blob/main/docs/contributing/Chat.md [Data Driven Fixes]: https://github.com/flutter/flutter/blob/main/docs/contributing/Data-driven-Fixes.md
75 lines
2.4 KiB
Dart
75 lines
2.4 KiB
Dart
// 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 'template.dart';
|
|
|
|
class ProgressIndicatorTemplate extends TokenTemplate {
|
|
const ProgressIndicatorTemplate(super.blockName, super.fileName, super.tokens, {
|
|
super.colorSchemePrefix = '_colors.',
|
|
});
|
|
|
|
@override
|
|
String generate() => '''
|
|
class _Circular${blockName}DefaultsM3 extends ProgressIndicatorThemeData {
|
|
_Circular${blockName}DefaultsM3(this.context, { required this.indeterminate });
|
|
|
|
final BuildContext context;
|
|
late final ColorScheme _colors = Theme.of(context).colorScheme;
|
|
final bool indeterminate;
|
|
|
|
@override
|
|
Color get color => ${componentColor('md.comp.progress-indicator.active-indicator')};
|
|
|
|
@override
|
|
Color? get circularTrackColor => indeterminate ? null : ${componentColor('md.comp.progress-indicator.track')};
|
|
|
|
@override
|
|
double get strokeWidth => ${getToken('md.comp.progress-indicator.track.thickness')};
|
|
|
|
@override
|
|
double? get strokeAlign => CircularProgressIndicator.strokeAlignInside;
|
|
|
|
@override
|
|
BoxConstraints get constraints => const BoxConstraints(
|
|
minWidth: 40.0,
|
|
minHeight: 40.0,
|
|
);
|
|
|
|
@override
|
|
double? get trackGap => ${getToken('md.comp.progress-indicator.active-indicator-track-space')};
|
|
|
|
@override
|
|
EdgeInsetsGeometry? get circularTrackPadding => const EdgeInsets.all(4.0);
|
|
}
|
|
|
|
class _Linear${blockName}DefaultsM3 extends ProgressIndicatorThemeData {
|
|
_Linear${blockName}DefaultsM3(this.context);
|
|
|
|
final BuildContext context;
|
|
late final ColorScheme _colors = Theme.of(context).colorScheme;
|
|
|
|
@override
|
|
Color get color => ${componentColor('md.comp.progress-indicator.active-indicator')};
|
|
|
|
@override
|
|
Color get linearTrackColor => ${componentColor('md.comp.progress-indicator.track')};
|
|
|
|
@override
|
|
double get linearMinHeight => ${getToken('md.comp.progress-indicator.track.thickness')};
|
|
|
|
@override
|
|
BorderRadius get borderRadius => BorderRadius.circular(${getToken('md.comp.progress-indicator.track.thickness')} / 2);
|
|
|
|
@override
|
|
Color get stopIndicatorColor => ${componentColor('md.comp.progress-indicator.stop-indicator')};
|
|
|
|
@override
|
|
double? get stopIndicatorRadius => ${getToken('md.comp.progress-indicator.stop-indicator.size')} / 2;
|
|
|
|
@override
|
|
double? get trackGap => ${getToken('md.comp.progress-indicator.active-indicator-track-space')};
|
|
}
|
|
''';
|
|
}
|