[iOS] : Inconsistency in Simulator and Real Device when using ColorFiltered and Opacity together #157716
Description
Steps to reproduce
The code that i am trying to run uses ColorFiltered and Opacity widgets together which renders differently on IOS Simulator (Iphone 15 Pro Max - iOS 17.5) and actual device (iPhone XR - iOS 18.0).
Opacity is ignored in the actual device whereas in the simulator, the opacity works.
Tested it on android device and emulator as well. The output is the same as the simulator one.
Expected results
The rendered widget should match on both simulator and device
Actual results
The rendered widget does not match on simulator and device
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
title: 'Flutter Demo',
home: Scaffold(
body: SafeArea(
child: Opacity(
opacity: 0.5,
child: ColorFiltered(
colorFilter:
ColorFilter.mode(Colors.transparent, BlendMode.saturation),
child: FlutterLogo(size: 550),
),
),
),
),
);
}
}
Screenshots or Video
Output from Simulator
Output from Device
Logs
Logs
[Paste your logs here]Flutter Doctor output
Doctor output
❯ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.24.3, on macOS 15.0.1 24A348 darwin-arm64, locale en-IN)
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 16.0)
[✗] Chrome - develop for the web (Cannot find Chrome executable at /Applications/Google
Chrome.app/Contents/MacOS/Google Chrome)
! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.
[✓] Android Studio (version 2024.1)
[✓] Connected device (4 available)
[✓] Network resources