object-fit:cover Not Working with ImageCapture.takePhoto on Mobile
I try to show the photo with object-fit:cover taken by the ImageCapture API. It works perfectly with Chrome on desktop. However, the object-fit:cover style is NOT working with Chrome on Android for ALL devices and emulators.
A minimal sample for this issue can be found here.
The size of <img id="photoImg" /> is fixed to 200 * 400 px to demonstrate the object-fit:cover style. The src of the image is generated from the ImageCapture.takePhoto() method and converted the blob to URL via URL.createObjectURL() function.
The following the result from Chrome on desktop, which is working perfectly.
Sadly, the following result from Chrome on Android (Sony Xperia 1) has the distorted image ratio. It seems the object-fit:cover does not work.
I have used Remote Debugging Android Devices to confirm that other object-fit values, such as object-fit:contain do work as expected.
I suspect that the Blob from ImageCapture might miss some critical pieces of information for the image ratio to be correctly calculated but I do not know how to investigate further.
How can I make the object-fit:cover work on mobile devices with Chrome?
After investigation, I find the root cause: a Chromium bug. It has been fixed and released in version 89. Thus, this question is no longer valid.
- Getting android.intent.action.MAIN when approaching a NFC tag
- Android : Is there anyway to get battery capacity of a device in mah?
- react native build error: package android.support.annotation does not exist
- Android - Store inputstream in file
- Difference between CoroutineScope(Dispatchers.IO + Job()) and CoroutineScope(Dispatchers.IO) + Job()
- Could not recognize my android device on mac
- How do I create ColorStateList programmatically?
- Blur in Jetpack Compose
- FCM version update for SDK
- error java.lang.RuntimeException: Unable to destroy activity IllegalStateException: Can not perform this action after onSaveInstanceState
- How can we extract values from URL when redirect to a Android app?
- Android 13 - READ_EXTERNAL_STORAGE_PERMISSION still usable
- Register to be default app for custom file type
- How to securely store access token and secret in Android?
- flutter: geolocator isnt working, Make sure at least ACCESS_FINE_LOCATION or ACCESS_COARSE_LOCATION are defined in the manifest
- ClassCastException in Production Build after Login in Android App
- Regular expression matching Android package name
- MIssing old package with jcenter closure
- Koin 2.2.1 : I cannot use "by viewModel" in Activity
- Please use override option or check for definition, koin android?
- LazyColumn is slower than Column with vertical scroll
- How to Sign an Already Compiled Apk
- Android: making a fullscreen application
- Android link in dialog
- Xamarin EditText InputType Password
- Android Jetpack Compose: How to show styled Text from string resources
- PagedList is deprecated
- TransactionTooLargeException even when file size is super small
- Android Stuido: How to change Kotlin version that is used for building with Gradle
- Best practice for storing and protecting private API keys in applications