text.dart 21.7 KB
Newer Older
Ian Hickson's avatar
Ian Hickson committed
1
// Copyright 2014 The Flutter Authors. All rights reserved.
2 3 4
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

5 6
import 'dart:ui' as ui show TextHeightBehavior;

7
import 'package:flutter/foundation.dart';
8 9 10

import 'basic.dart';
import 'framework.dart';
11
import 'inherited_theme.dart';
12 13
import 'media_query.dart';

14
// Examples can assume:
15
// late String _name;
16

17 18
/// The text style to apply to descendant [Text] widgets which don't have an
/// explicit style.
19 20 21 22 23 24 25
///
/// See also:
///
///  * [AnimatedDefaultTextStyle], which animates changes in the text style
///    smoothly over a given duration.
///  * [DefaultTextStyleTransition], which takes a provided [Animation] to
///    animate changes in text style smoothly over time.
26
class DefaultTextStyle extends InheritedTheme {
27 28
  /// Creates a default text style for the given subtree.
  ///
29
  /// Consider using [DefaultTextStyle.merge] to inherit styling information
30
  /// from the current default text style for a given [BuildContext].
31 32 33 34 35 36 37 38
  ///
  /// The [style] and [child] arguments are required and must not be null.
  ///
  /// The [softWrap] and [overflow] arguments must not be null (though they do
  /// have default values).
  ///
  /// The [maxLines] property may be null (and indeed defaults to null), but if
  /// it is not null, it must be greater than zero.
39
  const DefaultTextStyle({
40 41
    Key? key,
    required this.style,
42
    this.textAlign,
43 44
    this.softWrap = true,
    this.overflow = TextOverflow.clip,
45
    this.maxLines,
46
    this.textWidthBasis = TextWidthBasis.parent,
47
    this.textHeightBehavior,
48
    required Widget child,
49 50 51
  }) : assert(style != null),
       assert(softWrap != null),
       assert(overflow != null),
52
       assert(maxLines == null || maxLines > 0),
53
       assert(child != null),
54
       assert(textWidthBasis != null),
55
       super(key: key, child: child);
56

57
  /// A const-constructable default text style that provides fallback values.
58 59
  ///
  /// Returned from [of] when the given [BuildContext] doesn't have an enclosing default text style.
60
  ///
61
  /// This constructor creates a [DefaultTextStyle] with an invalid [child], which
62
  /// means the constructed value cannot be incorporated into the tree.
63
  const DefaultTextStyle.fallback({ Key? key })
64 65 66
    : style = const TextStyle(),
      textAlign = null,
      softWrap = true,
67
      maxLines = null,
68
      overflow = TextOverflow.clip,
69
      textWidthBasis = TextWidthBasis.parent,
70
      textHeightBehavior = null,
71
      super(key: key, child: const _NullWidget());
72

73 74
  /// Creates a default text style that overrides the text styles in scope at
  /// this point in the widget tree.
75 76
  ///
  /// The given [style] is merged with the [style] from the default text style
77 78 79
  /// for the [BuildContext] where the widget is inserted, and any of the other
  /// arguments that are not null replace the corresponding properties on that
  /// same default text style.
80 81 82 83 84 85 86 87 88
  ///
  /// This constructor cannot be used to override the [maxLines] property of the
  /// ancestor with the value null, since null here is used to mean "defer to
  /// ancestor". To replace a non-null [maxLines] from an ancestor with the null
  /// value (to remove the restriction on number of lines), manually obtain the
  /// ambient [DefaultTextStyle] using [DefaultTextStyle.of], then create a new
  /// [DefaultTextStyle] using the [new DefaultTextStyle] constructor directly.
  /// See the source below for an example of how to do this (since that's
  /// essentially what this constructor does).
89
  static Widget merge({
90 91 92 93 94 95 96 97
    Key? key,
    TextStyle? style,
    TextAlign? textAlign,
    bool? softWrap,
    TextOverflow? overflow,
    int? maxLines,
    TextWidthBasis? textWidthBasis,
    required Widget child,
98 99
  }) {
    assert(child != null);
100
    return Builder(
101 102
      builder: (BuildContext context) {
        final DefaultTextStyle parent = DefaultTextStyle.of(context);
103
        return DefaultTextStyle(
104
          key: key,
105
          style: parent.style.merge(style),
106 107 108 109
          textAlign: textAlign ?? parent.textAlign,
          softWrap: softWrap ?? parent.softWrap,
          overflow: overflow ?? parent.overflow,
          maxLines: maxLines ?? parent.maxLines,
110
          textWidthBasis: textWidthBasis ?? parent.textWidthBasis,
111
          child: child,
112 113
        );
      },
114 115 116 117
    );
  }

  /// The text style to apply.
118
  final TextStyle style;
119

120
  /// How each line of text in the Text widget should be aligned horizontally.
121
  final TextAlign? textAlign;
122 123 124 125

  /// Whether the text should break at soft line breaks.
  ///
  /// If false, the glyphs in the text will be positioned as if there was unlimited horizontal space.
126 127 128
  ///
  /// This also decides the [overflow] property's behavior. If this is true or null,
  /// the glyph causing overflow, and those that follow, will not be rendered.
129 130 131
  final bool softWrap;

  /// How visual overflow should be handled.
132 133 134
  ///
  /// If [softWrap] is true or null, the glyph causing overflow, and those that follow,
  /// will not be rendered. Otherwise, it will be shown with the given overflow option.
135 136
  final TextOverflow overflow;

137 138 139
  /// An optional maximum number of lines for the text to span, wrapping if necessary.
  /// If the text exceeds the given number of lines, it will be truncated according
  /// to [overflow].
140 141 142 143 144 145
  ///
  /// If this is 1, text will not wrap. Otherwise, text will be wrapped at the
  /// edge of the box.
  ///
  /// If this is non-null, it will override even explicit null values of
  /// [Text.maxLines].
146
  final int? maxLines;
147

148
  /// The strategy to use when calculating the width of the Text.
149
  ///
150 151 152
  /// See [TextWidthBasis] for possible values and their implications.
  final TextWidthBasis textWidthBasis;

153
  /// {@macro dart.ui.textHeightBehavior}
154
  final ui.TextHeightBehavior? textHeightBehavior;
155

156 157 158 159
  /// The closest instance of this class that encloses the given context.
  ///
  /// If no such instance exists, returns an instance created by
  /// [DefaultTextStyle.fallback], which contains fallback values.
160 161 162 163 164 165
  ///
  /// Typical usage is as follows:
  ///
  /// ```dart
  /// DefaultTextStyle style = DefaultTextStyle.of(context);
  /// ```
166
  static DefaultTextStyle of(BuildContext context) {
167
    return context.dependOnInheritedWidgetOfExactType<DefaultTextStyle>() ?? const DefaultTextStyle.fallback();
168 169 170
  }

  @override
171 172 173 174 175
  bool updateShouldNotify(DefaultTextStyle oldWidget) {
    return style != oldWidget.style ||
        textAlign != oldWidget.textAlign ||
        softWrap != oldWidget.softWrap ||
        overflow != oldWidget.overflow ||
176
        maxLines != oldWidget.maxLines ||
177 178
        textWidthBasis != oldWidget.textWidthBasis ||
        textHeightBehavior != oldWidget.textHeightBehavior;
179 180 181 182
  }

  @override
  Widget wrap(BuildContext context, Widget child) {
183
    return DefaultTextStyle(
184 185 186 187 188 189
      style: style,
      textAlign: textAlign,
      softWrap: softWrap,
      overflow: overflow,
      maxLines: maxLines,
      textWidthBasis: textWidthBasis,
190
      textHeightBehavior: textHeightBehavior,
191 192
      child: child,
    );
193
  }
194 195

  @override
196 197
  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
    super.debugFillProperties(properties);
198
    style.debugFillProperties(properties);
199 200 201 202
    properties.add(EnumProperty<TextAlign>('textAlign', textAlign, defaultValue: null));
    properties.add(FlagProperty('softWrap', value: softWrap, ifTrue: 'wrapping at box width', ifFalse: 'no wrapping except at line break characters', showName: true));
    properties.add(EnumProperty<TextOverflow>('overflow', overflow, defaultValue: null));
    properties.add(IntProperty('maxLines', maxLines, defaultValue: null));
203
    properties.add(EnumProperty<TextWidthBasis>('textWidthBasis', textWidthBasis, defaultValue: TextWidthBasis.parent));
204
    properties.add(DiagnosticsProperty<ui.TextHeightBehavior>('textHeightBehavior', textHeightBehavior, defaultValue: null));
205 206 207
  }
}

208 209 210 211 212 213 214 215
class _NullWidget extends StatelessWidget {
  const _NullWidget();

  @override
  Widget build(BuildContext context) {
    throw FlutterError(
      'A DefaultTextStyle constructed with DefaultTextStyle.fallback cannot be incorporated into the widget tree, '
      'it is meant only to provide a fallback value returned by DefaultTextStyle.of() '
216
      'when no enclosing default text style is present in a BuildContext.',
217 218 219 220
    );
  }
}

221 222
/// The [TextHeightBehavior] that will apply to descendant [Text] and [EditableText]
/// widgets which have not explicitly set [Text.textHeightBehavior].
223 224 225 226 227 228 229 230 231 232 233 234 235 236
///
/// If there is a [DefaultTextStyle] with a non-null [DefaultTextStyle.textHeightBehavior]
/// below this widget, the [DefaultTextStyle.textHeightBehavior] will be used
/// over this widget's [TextHeightBehavior].
///
/// See also:
///
///  * [DefaultTextStyle], which defines a [TextStyle] to apply to descendant
///    [Text] widgets.
class DefaultTextHeightBehavior extends InheritedTheme {
  /// Creates a default text height behavior for the given subtree.
  ///
  /// The [textHeightBehavior] and [child] arguments are required and must not be null.
  const DefaultTextHeightBehavior({
237 238 239
    Key? key,
    required this.textHeightBehavior,
    required Widget child,
240 241 242 243
  }) :  assert(textHeightBehavior != null),
        assert(child != null),
        super(key: key, child: child);

244
  /// {@macro dart.ui.textHeightBehavior}
245 246 247 248 249 250 251 252 253 254 255
  final TextHeightBehavior textHeightBehavior;

  /// The closest instance of this class that encloses the given context.
  ///
  /// If no such instance exists, this method will return `null`.
  ///
  /// Typical usage is as follows:
  ///
  /// ```dart
  /// DefaultTextHeightBehavior defaultTextHeightBehavior = DefaultTextHeightBehavior.of(context);
  /// ```
256
  static TextHeightBehavior? of(BuildContext context) {
257 258 259 260 261 262 263 264 265 266
    return context.dependOnInheritedWidgetOfExactType<DefaultTextHeightBehavior>()?.textHeightBehavior;
  }

  @override
  bool updateShouldNotify(DefaultTextHeightBehavior oldWidget) {
    return textHeightBehavior != oldWidget.textHeightBehavior;
  }

  @override
  Widget wrap(BuildContext context, Widget child) {
267
    return DefaultTextHeightBehavior(
268 269 270 271 272 273 274 275 276 277 278 279
      textHeightBehavior: textHeightBehavior,
      child: child,
    );
  }

  @override
  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
    super.debugFillProperties(properties);
    properties.add(DiagnosticsProperty<ui.TextHeightBehavior>('textHeightBehavior', textHeightBehavior, defaultValue: null));
  }
}

280 281 282 283 284 285 286 287
/// A run of text with a single style.
///
/// The [Text] widget displays a string of text with single style. The string
/// might break across multiple lines or might all be displayed on the same line
/// depending on the layout constraints.
///
/// The [style] argument is optional. When omitted, the text will use the style
/// from the closest enclosing [DefaultTextStyle]. If the given style's
288 289 290 291
/// [TextStyle.inherit] property is true (the default), the given style will
/// be merged with the closest enclosing [DefaultTextStyle]. This merging
/// behavior is useful, for example, to make the text bold while using the
/// default font family and size.
292
///
293
/// {@tool snippet}
294
///
295 296
/// This example shows how to display text using the [Text] widget with the
/// [overflow] set to [TextOverflow.ellipsis].
297
///
298
/// ![If the text is shorter than the available space, it is displayed in full without an ellipsis.](https://flutter.github.io/assets-for-api-docs/assets/widgets/text.png)
299
///
300
/// ![If the text overflows, the Text widget displays an ellipsis to trim the overflowing text](https://flutter.github.io/assets-for-api-docs/assets/widgets/text_ellipsis.png)
301
///
302
/// ```dart
303
/// Text(
304
///   'Hello, $_name! How are you?',
305 306
///   textAlign: TextAlign.center,
///   overflow: TextOverflow.ellipsis,
307
///   style: const TextStyle(fontWeight: FontWeight.bold),
308 309
/// )
/// ```
310
/// {@end-tool}
311
///
312 313 314 315 316
/// Using the [Text.rich] constructor, the [Text] widget can
/// display a paragraph with differently styled [TextSpan]s. The sample
/// that follows displays "Hello beautiful world" with different styles
/// for each word.
///
317
/// {@tool snippet}
318
///
319
/// ![The word "Hello" is shown with the default text styles. The word "beautiful" is italicized. The word "world" is bold.](https://flutter.github.io/assets-for-api-docs/assets/widgets/text_rich.png)
320
///
321 322
/// ```dart
/// const Text.rich(
323
///   TextSpan(
324
///     text: 'Hello', // default text style
325 326 327
///     children: <TextSpan>[
///       TextSpan(text: ' beautiful ', style: TextStyle(fontStyle: FontStyle.italic)),
///       TextSpan(text: 'world', style: TextStyle(fontWeight: FontWeight.bold)),
328 329
///     ],
///   ),
330
/// )
331
/// ```
332
/// {@end-tool}
333
///
334 335 336 337 338
/// ## Interactivity
///
/// To make [Text] react to touch events, wrap it in a [GestureDetector] widget
/// with a [GestureDetector.onTap] handler.
///
339
/// In a material design application, consider using a [TextButton] instead, or
340 341 342 343 344 345 346
/// if that isn't appropriate, at least using an [InkWell] instead of
/// [GestureDetector].
///
/// To make sections of the text interactive, use [RichText] and specify a
/// [TapGestureRecognizer] as the [TextSpan.recognizer] of the relevant part of
/// the text.
///
347 348
/// See also:
///
349 350
///  * [RichText], which gives you more control over the text styles.
///  * [DefaultTextStyle], which sets default styles for [Text] widgets.
351 352 353 354 355
class Text extends StatelessWidget {
  /// Creates a text widget.
  ///
  /// If the [style] argument is null, the text will use the style from the
  /// closest enclosing [DefaultTextStyle].
356 357
  ///
  /// The [data] parameter must not be null.
358 359 360 361
  ///
  /// The [overflow] property's behavior is affected by the [softWrap] argument.
  /// If the [softWrap] is true or null, the glyph causing overflow, and those that follow,
  /// will not be rendered. Otherwise, it will be shown with the given overflow option.
362
  const Text(
363 364
    String this.data, {
    Key? key,
365
    this.style,
366
    this.strutStyle,
367
    this.textAlign,
Ian Hickson's avatar
Ian Hickson committed
368
    this.textDirection,
369
    this.locale,
370 371
    this.softWrap,
    this.overflow,
372 373
    this.textScaleFactor,
    this.maxLines,
374
    this.semanticsLabel,
375
    this.textWidthBasis,
376
    this.textHeightBehavior,
377 378 379 380
  }) : assert(
         data != null,
         'A non-null String must be provided to a Text widget.',
       ),
381
       textSpan = null,
382
       super(key: key);
383

384 385 386 387 388 389
  /// Creates a text widget with a [InlineSpan].
  ///
  /// The following subclasses of [InlineSpan] may be used to build rich text:
  ///
  /// * [TextSpan]s define text and children [InlineSpan]s.
  /// * [WidgetSpan]s define embedded inline widgets.
390 391
  ///
  /// The [textSpan] parameter must not be null.
392 393
  ///
  /// See [RichText] which provides a lower-level way to draw text.
394
  const Text.rich(
395 396
    InlineSpan this.textSpan, {
    Key? key,
397
    this.style,
398
    this.strutStyle,
399 400
    this.textAlign,
    this.textDirection,
401
    this.locale,
402 403 404 405
    this.softWrap,
    this.overflow,
    this.textScaleFactor,
    this.maxLines,
406
    this.semanticsLabel,
407
    this.textWidthBasis,
408
    this.textHeightBehavior,
409 410 411 412
  }) : assert(
         textSpan != null,
         'A non-null TextSpan must be provided to a Text.rich widget.',
       ),
413 414
       data = null,
       super(key: key);
415

416
  /// The text to display.
417 418
  ///
  /// This will be null if a [textSpan] is provided instead.
419
  final String? data;
420

421
  /// The text to display as a [InlineSpan].
422 423
  ///
  /// This will be null if [data] is provided instead.
424
  final InlineSpan? textSpan;
425

426 427 428 429 430
  /// If non-null, the style to use for this text.
  ///
  /// If the style's "inherit" property is true, the style will be merged with
  /// the closest enclosing [DefaultTextStyle]. Otherwise, the style will
  /// replace the closest enclosing [DefaultTextStyle].
431
  final TextStyle? style;
432

433
  /// {@macro flutter.painting.textPainter.strutStyle}
434
  final StrutStyle? strutStyle;
435

436
  /// How the text should be aligned horizontally.
437
  final TextAlign? textAlign;
438

Ian Hickson's avatar
Ian Hickson committed
439 440 441 442 443 444 445 446 447
  /// The directionality of the text.
  ///
  /// This decides how [textAlign] values like [TextAlign.start] and
  /// [TextAlign.end] are interpreted.
  ///
  /// This is also used to disambiguate how to render bidirectional text. For
  /// example, if the [data] is an English phrase followed by a Hebrew phrase,
  /// in a [TextDirection.ltr] context the English phrase will be on the left
  /// and the Hebrew phrase to its right, while in a [TextDirection.rtl]
448
  /// context, the English phrase will be on the right and the Hebrew phrase on
Ian Hickson's avatar
Ian Hickson committed
449 450 451
  /// its left.
  ///
  /// Defaults to the ambient [Directionality], if any.
452
  final TextDirection? textDirection;
Ian Hickson's avatar
Ian Hickson committed
453

454 455 456 457 458 459 460
  /// Used to select a font when the same Unicode character can
  /// be rendered differently, depending on the locale.
  ///
  /// It's rarely necessary to set this property. By default its value
  /// is inherited from the enclosing app with `Localizations.localeOf(context)`.
  ///
  /// See [RenderParagraph.locale] for more information.
461
  final Locale? locale;
462

463 464 465
  /// Whether the text should break at soft line breaks.
  ///
  /// If false, the glyphs in the text will be positioned as if there was unlimited horizontal space.
466
  final bool? softWrap;
467 468

  /// How visual overflow should be handled.
469
  ///
470 471
  /// If this is null [TextStyle.overflow] will be used, otherwise the value
  /// from the nearest [DefaultTextStyle] ancestor will be used.
472
  final TextOverflow? overflow;
473 474 475 476 477 478

  /// The number of font pixels for each logical pixel.
  ///
  /// For example, if the text scale factor is 1.5, text will be 50% larger than
  /// the specified font size.
  ///
479
  /// The value given to the constructor as textScaleFactor. If null, will
480
  /// use the [MediaQueryData.textScaleFactor] obtained from the ambient
481
  /// [MediaQuery], or 1.0 if there is no [MediaQuery] in scope.
482
  final double? textScaleFactor;
483

484
  /// An optional maximum number of lines for the text to span, wrapping if necessary.
485 486
  /// If the text exceeds the given number of lines, it will be truncated according
  /// to [overflow].
487 488 489 490 491 492 493 494
  ///
  /// If this is 1, text will not wrap. Otherwise, text will be wrapped at the
  /// edge of the box.
  ///
  /// If this is null, but there is an ambient [DefaultTextStyle] that specifies
  /// an explicit number for its [DefaultTextStyle.maxLines], then the
  /// [DefaultTextStyle] value will take precedence. You can use a [RichText]
  /// widget directly to entirely override the [DefaultTextStyle].
495
  final int? maxLines;
496

497
  /// {@template flutter.widgets.Text.semanticsLabel}
498 499 500
  /// An alternative semantics label for this text.
  ///
  /// If present, the semantics of this widget will contain this value instead
501 502
  /// of the actual text. This will overwrite any of the semantics labels applied
  /// directly to the [TextSpan]s.
503
  ///
504
  /// This is useful for replacing abbreviations or shorthands with the full
505 506 507
  /// text value:
  ///
  /// ```dart
508
  /// Text(r'$$', semanticsLabel: 'Double dollars')
509
  /// ```
510
  /// {@endtemplate}
511
  final String? semanticsLabel;
512

513
  /// {@macro flutter.painting.textPainter.textWidthBasis}
514
  final TextWidthBasis? textWidthBasis;
515

516
  /// {@macro dart.ui.textHeightBehavior}
517
  final ui.TextHeightBehavior? textHeightBehavior;
518

519 520
  @override
  Widget build(BuildContext context) {
521
    final DefaultTextStyle defaultTextStyle = DefaultTextStyle.of(context);
522 523
    TextStyle? effectiveTextStyle = style;
    if (style == null || style!.inherit)
524
      effectiveTextStyle = defaultTextStyle.style.merge(style);
525
    if (MediaQuery.boldTextOverride(context))
526
      effectiveTextStyle = effectiveTextStyle!.merge(const TextStyle(fontWeight: FontWeight.bold));
527
    Widget result = RichText(
Ian Hickson's avatar
Ian Hickson committed
528 529
      textAlign: textAlign ?? defaultTextStyle.textAlign ?? TextAlign.start,
      textDirection: textDirection, // RichText uses Directionality.of to obtain a default if this is null.
530
      locale: locale, // RichText uses Localizations.localeOf to obtain a default if this is null
531
      softWrap: softWrap ?? defaultTextStyle.softWrap,
532
      overflow: overflow ?? effectiveTextStyle?.overflow ?? defaultTextStyle.overflow,
533
      textScaleFactor: textScaleFactor ?? MediaQuery.textScaleFactorOf(context),
534
      maxLines: maxLines ?? defaultTextStyle.maxLines,
535
      strutStyle: strutStyle,
536
      textWidthBasis: textWidthBasis ?? defaultTextStyle.textWidthBasis,
537
      textHeightBehavior: textHeightBehavior ?? defaultTextStyle.textHeightBehavior ?? DefaultTextHeightBehavior.of(context),
538
      text: TextSpan(
539
        style: effectiveTextStyle,
540
        text: data,
541
        children: textSpan != null ? <InlineSpan>[textSpan!] : null,
542
      ),
543
    );
544
    if (semanticsLabel != null) {
545
      result = Semantics(
546 547
        textDirection: textDirection,
        label: semanticsLabel,
548
        child: ExcludeSemantics(
549
          child: result,
550
        ),
551 552 553
      );
    }
    return result;
554 555 556
  }

  @override
557 558
  void debugFillProperties(DiagnosticPropertiesBuilder properties) {
    super.debugFillProperties(properties);
559
    properties.add(StringProperty('data', data, showName: false));
560
    if (textSpan != null) {
561
      properties.add(textSpan!.toDiagnosticsNode(name: 'textSpan', style: DiagnosticsTreeStyle.transition));
562
    }
563
    style?.debugFillProperties(properties);
564 565 566 567 568 569 570
    properties.add(EnumProperty<TextAlign>('textAlign', textAlign, defaultValue: null));
    properties.add(EnumProperty<TextDirection>('textDirection', textDirection, defaultValue: null));
    properties.add(DiagnosticsProperty<Locale>('locale', locale, defaultValue: null));
    properties.add(FlagProperty('softWrap', value: softWrap, ifTrue: 'wrapping at box width', ifFalse: 'no wrapping except at line break characters', showName: true));
    properties.add(EnumProperty<TextOverflow>('overflow', overflow, defaultValue: null));
    properties.add(DoubleProperty('textScaleFactor', textScaleFactor, defaultValue: null));
    properties.add(IntProperty('maxLines', maxLines, defaultValue: null));
571 572
    properties.add(EnumProperty<TextWidthBasis>('textWidthBasis', textWidthBasis, defaultValue: null));
    properties.add(DiagnosticsProperty<ui.TextHeightBehavior>('textHeightBehavior', textHeightBehavior, defaultValue: null));
573
    if (semanticsLabel != null) {
574
      properties.add(StringProperty('semanticsLabel', semanticsLabel));
575
    }
576 577
  }
}