table_calendar icon indicating copy to clipboard operation
table_calendar copied to clipboard

Selected Range has vertical lines on Android but not on iOS.

Open wildsurfer opened this issue 1 year ago • 3 comments

Describe the bug The bug is reproducible on the example project. To highlight problem even better I switched theme to the dark mode.

You may see some annoying vertical lines on a date range selection (see screenshot below). This is happening only on Android but not on iOS.

To reproduce

Steps to reproduce the behavior:

  1. Run the example project on Android
  2. Go to 'Range Selection' example
  3. Select any date range

Expected behavior I expect it to work exactly as it works on iOS platform. There should be no vertical lines

Screenshots Screenshot_20230706-110014

Output of flutter doctor

flutter doctor --verbose [✓] Flutter (Channel stable, 3.10.1, on macOS 13.4.1 22F82 darwin-arm64, locale en-UA) • Flutter version 3.10.1 on channel stable at /Users/kuzma/Flutter/flutter • Upstream repository https://github.com/flutter/flutter.git • Framework revision d3d8effc68 (7 weeks ago), 2023-05-16 17:59:05 -0700 • Engine revision b4fb11214d • Dart version 3.0.1 • DevTools version 2.23.1

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1) • Android SDK at /Users/kuzma/Library/Android/sdk • Platform android-33, build-tools 33.0.1 • Java binary at: /opt/homebrew/opt/openjdk@11/bin/java • Java version OpenJDK Runtime Environment Homebrew (build 11.0.15+0) • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 14.3.1) • Xcode at /Applications/Xcode.app/Contents/Developer • Build 14E300c • CocoaPods version 1.11.3

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

[!] Android Studio (not installed) • Android Studio not found; download from https://developer.android.com/studio/index.html (or visit https://flutter.dev/docs/get-started/install/macos#android-setup for detailed instructions).

[✓] IntelliJ IDEA Ultimate Edition (version 2023.1.3) • IntelliJ at /Applications/IntelliJ IDEA.app • Flutter plugin version 74.0.4 • Dart plugin version 231.9161.14

[✓] Connected device (2 available) • SM A032F (mobile) • R7ARB0938EF • android-arm • Android 12 (API 31) • Chrome (web) • chrome • web-javascript • Google Chrome 114.0.5735.198

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

Additional context I'm using Samsung Galaxy A03 Core with Android 12

wildsurfer avatar Jul 06 '23 08:07 wildsurfer

Quick and dirty solution for me was to put TableCalendar into SizedBox and give it a width that is divisible by 7 without a remainder.

wildsurfer avatar Jul 06 '23 11:07 wildsurfer

Example:

LayoutBuilder(builder: (context, constraints) {
    return SizedBox(
        width: constraints.maxWidth ~/ 7 * 7,
        child: TableCalendar(),
    );
}

wildsurfer avatar Jul 06 '23 12:07 wildsurfer

I made a fork to use in my project but I'm not sure if the solution is elegant enough to be merged into this library. Let me know what you think

https://github.com/aleksanderwozniak/table_calendar/compare/master...wildsurfer:table_calendar:master

wildsurfer avatar Jul 06 '23 13:07 wildsurfer