Skip to content

The image for the indicator of the TabBar does not auto-adapt to different resolutions #145204

@jmgaooo

Description

@jmgaooo

Steps to reproduce

According to the documentation for resolution-aware assets (https://flutter.cn/docs/ui/assets/assets-and-images#resolution-aware), my project's asset directory structure is as follows:

assets/images/icon/indicator.png
assets/images/icon/2.0x/indicator.png
assets/images/icon/3.0x/indicator.png

When specifying the indicator of the TabBar to use an image, the image does not auto-adapt to different resolutions.

After tracing the source code of the TabBar, it was found that this is due to the fact that the ImageConfiguration constructed during the execution of _IndicatorPainter does not specify the devicePixelRatio.

Expected results

The expected behavior is for the image to auto-adapt to different resolutions.

Actual results

The image does not auto-adapt to different resolutions.

Code sample

TabBar(
                        indicator: BoxDecoration(image: DecorationImage(image: AssetImage("assets/images/icon/indicator.png"),alignment :Alignment.bottomCenter)),
                        tabs: <Widget>[
                          Tab(
                            text: "tab1",
                          ),
                          Tab(
                            text: "tab2",
                          ),
                          Tab(
                            text: "tab3",
                          ),
                        ],
                      ),

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Flutter assets will be downloaded from https://storage.flutter-io.cn. Make sure you trust this source!
[√] Flutter (Channel stable, 3.16.1, on Microsoft Windows [版本 10.0.19045.4170], locale zh-CN)
• Flutter version 3.16.1 on channel stable at F:\flutter
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision 7f20e5d (4 months ago), 2023-11-27 09:47:30 -0800
• Engine revision 22b600f240
• Dart version 3.2.1
• DevTools version 2.28.3
• Pub download mirror https://pub.flutter-io.cn
• Flutter download mirror https://storage.flutter-io.cn

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at F:\Android\Sdk
• Platform android-34, build-tools 34.0.0
• Java binary at: F:\Android\AndroidStudio\jbr\bin\java
• Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)
• All Android licenses accepted.

[√] Chrome - develop for the web
• Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.7.2)
• Visual Studio at F:\Microsoft Visual Studio\2022\Community
• Visual Studio Community 2022 version 17.7.34018.315
• Windows 10 SDK version 10.0.22621.0

[√] Android Studio (version 2022.3)
• Android Studio at F:\Android\AndroidStudio
• Flutter plugin can be installed from:
https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)

[√] Connected device (4 available)
• M2007J3SC (mobile) • 192.168.152.37:40853 • android-arm64 • Android 12 (API 31)
• Windows (desktop) • windows • windows-x64 • Microsoft Windows [版本 10.0.19045.4170]
• Chrome (web) • chrome • web-javascript • Google Chrome 122.0.6261.113
• Edge (web) • edge • web-javascript • Microsoft Edge 122.0.2365.80

[√] Network resources
• All expected network resources are available.

• No issues found!

Metadata

Metadata

Assignees

Labels

P2Important issues not at the top of the work lista: assetsPackaging, accessing, or using assetsa: imagesLoading, displaying, rendering imagesf: material designflutter/packages/flutter/material repository.found in release: 3.19Found to occur in 3.19found in release: 3.21Found to occur in 3.21frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onr: fixedIssue is closed as already fixed in a newer versionteam-designOwned by Design Languages teamtriaged-designTriaged by Design Languages team

Type

No type

Projects

Status

Done (PR merged)

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions