From d9ad220bbb17972913fb687f8d673d79b9f66dab Mon Sep 17 00:00:00 2001 From: liyuqian Date: Tue, 20 Nov 2018 15:27:21 -0800 Subject: [PATCH] Explain why Opacity could be slow (#24255) --- packages/flutter/lib/src/widgets/basic.dart | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/packages/flutter/lib/src/widgets/basic.dart b/packages/flutter/lib/src/widgets/basic.dart index fa617ef68b0..a1044bee26c 100644 --- a/packages/flutter/lib/src/widgets/basic.dart +++ b/packages/flutter/lib/src/widgets/basic.dart @@ -156,12 +156,17 @@ class Directionality extends InheritedWidget { /// /// ## Transparent image /// -/// If only a single [Image] needs to be composited with an opacity between 0.0 -/// and 1.0, it's much faster to directly use [Image]. +/// If only a single [Image] or [Color] needs to be composited with an opacity +/// between 0.0 and 1.0, it's much faster to directly use them without [Opacity] +/// widgets. +/// +/// For example, `Container(color: Color.fromRGBO(255, 0, 0, 0.5))` is much +/// faster than `Opacity(opacity: 0.5, child: Container(color: Colors.red))`. /// /// {@tool sample} /// -/// This example draws an [Image] with 0.5 opacity: +/// The following example draws an [Image] with 0.5 opacity without using +/// [Opacity]: /// /// ```dart /// Image.network( @@ -170,8 +175,15 @@ class Directionality extends InheritedWidget { /// colorBlendMode: BlendMode.modulate /// ) /// ``` +/// /// {@end-tool} /// +/// Directly drawing an [Image] or [Color] with opacity is faster than using +/// [Opacity] on top of them because [Opacity] could apply the opacity to a +/// group of widgets and therefore a costly offscreen buffer will be used. +/// Drawing content into the offscreen buffer may also trigger render target +/// switches and such switching is particularly slow in older GPUs. +/// /// See also: /// /// * [Visibility], which can hide a child more efficiently (albeit less