Flutter quickstart
A thin plugin over the native iOS and Android SDKs. The measuring and 3D try-on window is our web window, opened by the native SDK (a sheet on iOS, full screen on Android).
Install
Section titled “Install”dependencies: tryyoursize: ^0.1.0 # from the source we share during the pilot- iOS (16+): the plugin depends on the
TryYourSizepod (CocoaPods;platform :ios, '16.0'). - Android (minSdk 24): the plugin depends on
com.tryyoursize:tryyoursize-android. The window needs an androidxComponentActivity, soMainActivitymust extendFlutterFragmentActivity:
class MainActivity : io.flutter.embedding.android.FlutterFragmentActivity()Register your app
Section titled “Register your app”In Studio, for test mode, add ios-app://<your bundle id> and android-app://<your package> (lower case).
final tys = await TryYourSize.create( 'pk_test_…', appearance: const Appearance(borderRadius: 10), // default theme: inherit your app's colours);
// The button, where your "Size guide" link was. A tap opens the window.const SizeGuide(product: 'SKU-123'); // or variant: SizeGuideVariant.button
// Preselect the recommended size, but never override the shopper's own choice.tys.onRecommendation('SKU-123').listen((rec) { if (rec.status == RecommendationStatus.ready && !touched) select(rec.size!);});
// The shopper picked a size in the window.tys.events.listen((e) { if (e is SizeSelected) select(e.selection.size);});
// Without the button:final rec = await tys.recommendation('SKU-123');await tys.present('SKU-123');Recommendation |
|
|---|---|
status |
ready, computing, noSize (simulated, no size is wearable), signedOut, unavailable (no size for this product yet) |
size |
The recommended size in your label, or null |
studioSize |
The same size as entered in Studio |
wearableSizes |
Sizes this body can wear, in your labels |
Errors are TryYourSizeException with a stable code: secret_key_in_app, invalid_key, invalid_app_identifier, app_not_allowed, window_unreachable.
Appearance: theme (inherit or tryyoursize, our light beige brand), colorPrimary, colorBackground, colorText, fontFamily, borderRadius (0–32) and fonts (Google Fonts stylesheet URLs). tys.setAppearance(...) restyles live, for example when your app switches to dark mode.
Was this page helpful?
Thank you. We read every answer.