Support app clips on iOS 14

We'll want more details from https://developer.apple.com/videos/play/wwdc2020/10174/. So far, it seems like it's just a separate build target in Xcode and you choose which target your sources get compiled into. Hopefully that includes selection for frameworks too.

@xster

Would that work because the limit for a clip is 10mb (if I remember correctly) and flutters framework is more than that. I could be wrong though. @xster

The default demo app is about 5.4 MB, that is plenty of room for small applications

As the adoption of NFC increases, this feature will become a must-have.

Would be great if it is cross platform. Clips for iOS, and Instant Apps for Android?

it looks like it is possible based from the initial documents and it is similar to universal links.

right, the devil's in the details but from https://developer.apple.com/videos/play/wwdc2020/10174/, it seems so far like there aren't any blocking conceptual issues.

well, exporting thin builds of our full app most of them show around 10MB. Given that, I assume that a size-optimized target for App Clip including only necessary features should be well below 10 MB. I guess we'd just need a mechanism for the new target, right?
Associated Domains feature is already integrated (for us, by using unilink package)

hmm right as per the app clip example given by apple ex : fruta

Really cool feature, would love to implement this in our app! These issues would probably help make this easier / viable #16815 #16813

I was able to create an App Clip running the Flutter demo by opening ios/Runner.xcworkspace in Xcode 12 and manually adding the target. This is not for the faint of heart and requires some Xcode knowledge to pull off.

Open ios/Runner.xcworkspace
Open the Project settings and hit the + to add a new target
Add an App Clip Target
Interface: Storyboard, Life Cycle: UI App Delegate
When prompted, hit Activate.
Delete the newly created AppDelegate.swift, ViewController.swift, Main.storyboard, Assets.xcassets, LaunchScreen.storyboard
Open Project (not Target!) settings > Info > Deployment Configurations. Base the new App Clip target on the same configurations as your Flutter Runner target. This will give them access to all the Flutter build settings (build number from your pubspec.yaml, etc). So "None" will become either "Debug" or "Release". Set the iOS Deployment Target to 13 (I couldn't get this working on < 13).
Open the App Clip entitlements file. Add the App Clip Associated Domains.
Compile/embed your exiting Runner Swift files and assets into both Runner and the new App Clip target by setting the membership of each of the following files:
AppDelegate.swift, ViewController.swift, Main.storyboard, Assets.xcassets, LaunchScreen.storyboard

etc
Open the App Clip Info.plist. Set Build version string (short) to $(FLUTTER_BUILD_NAME) and Bundle version to $(FLUTTER_BUILD_NUMBER). These need to match between the app and app clip target.
Create a new entitlements file for your Runner app. Selecting the Runner group, File > New > File... Property List
Call it Runner.entitlements (the entitlements extension is important) and add it to the Runner target.
Add the same Associated Domains you added to the App Clip entitlements file. DO NOT add the Parent Application Identifiers.
Open up your Runner target build settings. Set Code Signing Entitlements to the path of the Runner.entitlements file you just made, like Runner/Runner.entitlements.
Open up your App Clip target build settings. Set iOS Deployment Target to iOS 13.0 (or just delete the setting to inherit).
Still in your App Clip target build settings, in Framework Search Paths add $(inherited) and $(PROJECT_DIR)/Flutter in order so it can find the Flutter framework.
Still in your App Clip target build settings, set Objective-C Bridging Header to Runner/Runner-Bridging-Header.h.
Now go to your App Clip target Build Phases tab. Add a New Run Script Phase.
Drag it it so it's right below Dependencies, and paste the following (this matches the build phase in your Runner target).

/bin/sh "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" build

This will compile your Dart code. This should only happen once when you build your project since the back end will cache the results.

Make another New Run Script Phase. Drag it so it's below Copy Bundle Resources

/bin/sh "$FLUTTER_ROOT/packages/flutter_tools/bin/xcode_backend.sh" embed_and_thin

This will embed your Dart code and the Flutter engine into the App Clip bundle.

Run the App Clip scheme, targeting a iOS 14 device.

And it worked! Note the "Powered by" banner at the top.

Caveats

I make no guarantee of this working for your project, it's just a proof of concept to get you started. Please don't @ me to fix any linker errors, build setting problems, etc. 🙂
Obviously this is all manual, and ideally Flutter tooling would do all this for you.
I wasn't able to connect to the observatory, possibly because an entitlement is missing?
This will embed your entire app into the App Clip. You'll need to figure out the right entrypoint (and create a separate AppDelegate for each target, don't share them). It needs to stay under 10MB per Apple's requirements.
This could potentially be solved by embedding two Flutter add-to-app modules into a host app clip target?
I didn't have any plugins. Hopefully it would be pretty easy to add the new target to your ios/Podfile but I didn't try, maybe (in master) something like:

project 'RunnerAppClip', {
  'Debug' => :debug,
  'Profile' => :release,
  'Release' => :release,
}
...
target 'Runner' do
  flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__))
  target 'RunnerAppClip' do
    inherit! :search_paths
  end
end

Here's a zipped up version of that ios directory so you can open the Xcode project yourself and drop into a newly created flutter create test_appclip demo project. You'll need to change the signing team.
ios.zip

@jmagman

@jmagman Wow, thanks for workaround. Also I think you meant 10mb not 10GB.

@miguelpruivo

@miguelpruivo could you open a new issue for it? Sounds like you're asking for something slightly different than the premise of this bug. i.e. you want to have your App Clip be a standard SwiftUI App Clip rather than a Flutter powered App Clip while your main app is Flutter. Is that right? Could you describe your reproduction steps / project and the exact error?

FWIW, this is what it's supposed to look like after you install the App Clip on your test phone and then scan a generated QR code following https://developer.apple.com/documentation/app_clips/testing_your_app_clip_s_launch_experience

Another note: I never got the QR code scanning described in https://developer.apple.com/documentation/app_clips/testing_your_app_clip_s_launch_experience to work through the normal camera app for some reason. Though the built-in QR scanner that can be added to the Control Panel worked well.

I have added app clip into our flutter project and run well, but how to split part of plugins and assets out to app clip target? because app clip size has constraints.

@majingAragon

@majingAragon I need to know this as well. Currently clip is inheriting all the Runner dependencies, which makes it bloated and bigger than 10MB.

@majingAragon

@majingAragon can you open another issue describing your issue? Splitting plugins and assets are likely not very useful unless you also split the Dart code referencing those different subsets of plugins and assets (which is currently not supported).

We're doing some work in that area in #57617 and you can track our progress there.

When are you going to fully support app clips in a Flutter project? The official docs says that it's possible. I have succeded to create an app clip. But the size of a simple app clip, is way over the 10MB limit from just showing a simple screen. I've also tried to embed a simple swift view, without any shared resources from the main Flutter app. But the Flutter Framework is by default embedded in the app clip target. Therefore i wouldn't say that Flutter supports app clips yet.
I've really tried everything to keep app clip size down to minimum but it's seems impossible. Am i doing something wrong or are you working to solve this issue?

I've also tried to embed a simple swift view, without any shared resources from the main Flutter app. But the Flutter Framework is by default embedded in the app clip target.

If you don't have any Flutter elements in your app clip then you shouldn't be embedding any Flutter frameworks or plugins. There's no "default" here--you have control of what gets embedded in your app clip target.

But the size of a simple app clip, is way over the 10MB limit from just showing a simple screen.

Out of curiosity, how are you measuring it?

I've also tried to embed a simple swift view, without any shared resources from the main Flutter app. But the Flutter Framework is by default embedded in the app clip target.

If you don't have any Flutter elements in your app clip then you shouldn't be embedding any Flutter frameworks or plugins. There's no "default" here--you have control of what gets embedded in your app clip target.

But the size of a simple app clip, is way over the 10MB limit from just showing a simple screen.

Out of curiosity, how are you measuring it?

Ok, maybe i'm missing something then. I'll try to create the app clip again from scratch and see if i'm able to exclude the Flutter framework in some way. I'm not embedding it all, when archiving the app clip, the framework gets embedded.

I measure my app clip as seen in apple documentation/guidelines. Archive and export as ad hoc or development, app thining and after that checking the app thinning size report text file.

If anyone has done this successful (and keeping app clip size below 10MB) please let me know.

Update: it's not related to BitCode.

~~With bitcode = YES, I can't distribute app with AppClip to apple store.~~

~~Maybe it's apple's bug, not sure, I'm still searhing.~~

distribute_with_bitcode_NO not work(Left) || distribute_with_bitcode_YES works(Right)

It's now official that it's not possible to ship an app clip in a Flutter app. The documentation is also updated with this information.

#71098

And this is a minimal app. My app is way bigger than this (and so is the app clip). Hope they will fix this asap.

Also note you can ship an app clip in a Flutter app, just not a FLUTTER app clip.

Also note you can ship an app clip in a Flutter app, just not a FLUTTER app clip.

That's interesting. I've tried a native app clip embedded in a Flutter app. No luck, the app clip gets too big. But maybe i'm doing something wrong with the configuration for the app clip target. I would appreciate a small tutorial for that, because i've struggle hours.

You should just be able to open ios/Runner.xcworkspace, add the app clip target, and make sure not to reference Flutter at all. Flutter's pretty much just a few embedded frameworks in a normal iOS app, with a script to generate your compiled dart code, it's not that magic. So any vanilla non-Flutter App Clip tutorial online should work. You can dig into the generated App Clip bundle to make sure there's no Flutter pieces sneaking in.

This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

Navigation Menu

Repository navigation

Support app clips on iOS 14 #60029

Caveats

17 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Support app clips on iOS 14 #60029

Description

Activity

edeuss commented on Jun 22, 2020

jonahwilliams commented on Jun 22, 2020

vincentracine commented on Jun 23, 2020

newmskywalker commented on Jun 24, 2020

marqueeeeeee commented on Jun 24, 2020

xster commented on Jun 26, 2020

chris-schra commented on Jun 29, 2020

anandat commented on Jun 29, 2020

Isakdl commented on Jun 30, 2020

jmagman commented on Jun 30, 2020

Caveats

edeuss commented on Jun 30, 2020

17 remaining items

xster commented on Sep 26, 2020

xster commented on Sep 26, 2020

majingAragon commented on Sep 27, 2020

miguelpruivo commented on Sep 27, 2020

xster commented on Sep 28, 2020

espling commented on Nov 5, 2020

jmagman commented on Nov 5, 2020

espling commented on Nov 5, 2020

jerryzhoujw commented on Nov 13, 2020

espling commented on Dec 4, 2020

jmagman commented on Dec 4, 2020

espling commented on Dec 4, 2020

jmagman commented on Dec 4, 2020

github-actions commented on Aug 9, 2021

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions