Skip to content

Progress bar overflow on Emulator #935

@thruthesky

Description

@thruthesky

I am running the app with Chewie in Android Emulator. And the chewie video player has an overflowing progress bar like below.

Image

It looks fine on iOS Simulator. After some try with AI (installing the chewie package source code in my project with dev-dependency overriding) , I was able to fix. But does not look good.

1. [material_controls.dart](vscode-webview://00ua0hqbsc716k31bb7536f1plk1ocka94ot8qr18c81u3ua5tl6/packages/chewie/lib/src/material/material_controls.dart)

// Before
Expanded(
  child: Container(
    padding: ...,
    child: Row(children: [_buildProgressBar()]),  // Row 안에 Expanded
  ),
),

// After
Expanded(
  child: ClipRect(  // ClipRect로 overflow 방지
    child: Padding(
      padding: ...,
      child: _buildProgressBar(),  // Row 제거
    ),
  ),
),
2. [progress_bar.dart](vscode-webview://00ua0hqbsc716k31bb7536f1plk1ocka94ot8qr18c81u3ua5tl6/packages/chewie/lib/src/progress_bar.dart)

// VideoProgressBar.build - Remove Center
final child = StaticProgressBar(...);

// StaticProgressBar.build - Use SizedBox.expand
return SizedBox.expand(  // instead of, MediaQuery/LayoutBuilder
  child: CustomPaint(...),
);

This is the flutter doctor.

% flutter doctor -v
[✓] Flutter (Channel stable, 3.38.4, on macOS 26.1 25B78 darwin-arm64,
    locale en-PH) [767ms]
    • Flutter version 3.38.4 on channel stable at
      /Users/thruthesky/bin/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 66dd93f9a2 (12 days ago), 2025-12-03 14:56:10 -0800
    • Engine revision a5cb96369e
    • Dart version 3.10.3
    • DevTools version 2.51.1
    • Feature flags: enable-web, enable-linux-desktop, enable-macos-desktop,
      enable-windows-desktop, enable-android, enable-ios, cli-animations,
      enable-native-assets, omit-legacy-version-file, enable-lldb-debugging

[✓] Android toolchain - develop for Android devices (Android SDK version
    35.0.0) [2.8s]
    • Android SDK at /Users/thruthesky/Library/Android/sdk
    • Emulator version 31.3.13.0 (build_id 9189900) (CL:N/A)
    • Platform android-36, build-tools 35.0.0
    • ANDROID_HOME = /Users/thruthesky/Library/Android/sdk
    • ANDROID_SDK_ROOT = /Users/thruthesky/Library/Android/sdk
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
      This is the JDK bundled with the latest Android Studio installation on
      this machine.
      To manually set the JDK path, use: `flutter config
      --jdk-dir="path/to/jdk"`.
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b829.9-10027231)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 26.2) [2.5s]
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 17C52
    • CocoaPods version 1.16.2

[✓] Chrome - develop for the web [10ms]
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Connected device (5 available) [11.1s]
    • sdk gphone64 arm64 (mobile)      • emulator-5554             • android-arm64  •
      Android 12 (API 32) (emulator)
    • JaeHo16 (mobile)                 • 00008140-001C24C93E93001C • ios            • iOS
      26.1 23B85
    • JAEHO’s iPad (wireless) (mobile) • 00008103-000E41882631001E • ios            • iOS
      26.2 23C52
    • macOS (desktop)                  • macos                     • darwin-arm64   • macOS
      26.1 25B78 darwin-arm64
    • Chrome (web)                     • chrome                    • web-javascript • Google
      Chrome 143.0.7499.110
    ! Error: Browsing on the local area network for iPhone11ProMax. Ensure the device is
      unlocked and attached with a cable or associated with the same local area network as
      this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources [497ms]
    • All expected network resources are available.

• No issues found!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions