Hey guys. Im dealing with coil3. I want gif suppor...

# multiplatform

[Kapil Yadav]

Hey guys.
Im dealing with coil3.
I want gif support for that coil provides
1. ImageDecoderDecoder
2. GifDecoder
But in coil 3 I cant find them even I added dependency for gif support.
i.e implementation("io.coil-kt.coil3coil gif3.0.0-alpha02")

Please help if someone done this

[Joel Denke]

If using in commonMain/KMP level it doesnt exist yet, no support for video, svg or gif yet. However soon support for SVG in both Android/JVM and iOS 🙂

[Kapil Yadav]

: )

[Joel Denke]

You could inject that ImageLoader plugin based on platform I think, but can be a little tricky 😛 Like inject in DI level based on iOS vs Android and provide your own gif plugin for iOS but using the existing one for Coil Android JVM target.

[Joel Denke]

Doing semi this for Video myself, to test inject video in compose in iOS vs Android 😛

[Kapil Yadav]

for ios how can we achieve this ?

[Joel Denke]

Find an iOS library, easiest if cocoapods that using Gif encoders native and return result back to Coil or such I would do. Dont know if that exists, maybe need to build it yourself.

[Joel Denke]

Seems as of example this: https://ios.libhunt.com/flanimatedimage-alternatives
Can then add cocoapods in KMP level, and using actual implemenation for iOS using that one with cinterop for:

FLAnimatedImage *image = [FLAnimatedImage animatedImageWithGIFData:[NSData dataWithContentsOfURL:[NSURL URLWithString:@"<https://upload.wikimedia.org/wikipedia/commons/2/2c/Rotating_earth_%28large%29.gif>"]]];
FLAnimatedImageView *imageView = [[FLAnimatedImageView alloc] init];
imageView.animatedImage = image;
imageView.frame = CGRectMake(0.0, 0.0, 100.0, 100.0);
[self.view addSubview:imageView];

And then for Android using Coil variant.

[Joel Denke]

As of example for video in iOS I did like this:

@Composable
actual fun VideoPlayer(modifier: Modifier, url: String, settings: VideoSettings) {
    val player = remember { AVPlayer(uRL = NSURL.URLWithString(url)!!) }
    val playerLayer = remember { AVPlayerLayer() }
    val avPlayerViewController = remember { AVPlayerViewController() }
    avPlayerViewController.player = player
    avPlayerViewController.showsPlaybackControls = settings.showController
    avPlayerViewController.videoGravity = AVLayerVideoGravityResizeAspectFill

    playerLayer.player = player
    playerLayer.videoGravity = AVLayerVideoGravityResizeAspectFill
    UIKitView(
        factory = {
            // Create a UIView to hold the AVPlayerLayer
            val playerContainer = UIView()
            playerContainer.addSubview(avPlayerViewController.view)
            playerContainer
        },
        onResize = { view: UIView, rect: CValue<CGRect> ->
            CATransaction.begin()
            CATransaction.setValue(true, kCATransactionDisableActions)
            view.layer.setFrame(rect)
            playerLayer.setFrame(rect)
            avPlayerViewController.view.layer.frame = rect
            CATransaction.commit()
        },
        update = {
            player.play()
            avPlayerViewController.player?.play()
        },
        modifier = modifier
    )
}

I imagine could do similar for gifs 🙂

[Kapil Yadav]

Thanks mannn much helpful

[brandonmcansh]

@Kapil Yadav did you have any luck with this?

[Kapil Yadav]

Dropped the gif part for now. :)

[brandonmcansh]

https://kotlinlang.slack.com/archives/C0346LWVBJ4/p1708575641380989?thread_ts=1708539787.361589&cid=C0346LWVBJ4

[Kapil Yadav]

Demmn, I'll try this
Thanks