DEV Community: Michael Otieno Olang

Meta App Events in Flutter for Android: Setup, Tracking, and Ad Attribution

Michael Otieno Olang — Fri, 13 Nov 2026 06:23:46 +0000

A practical walkthrough of Meta App IDs, Android SDK setup, booking funnel events, and testing app campaign conversions.

I recently added Meta App Events to a Flutter booking app so we could measure app installs, see where people leave the booking flow, and eventually optimize Meta campaigns for paid tickets. The SDK was sending events, but one question remained: if my ad account has a different ID from my app, how does Meta connect a ticket sale to an ad?

This is the setup and testing guide I wish I had while working through it. It covers Android app events. An iOS build needs its own SDK and measurement setup; adding Android code does not enable iOS tracking.

First, identify the three IDs

ID	What it identifies	Where it belongs
Meta App ID	The app registered in Meta for Developers	Android SDK configuration and the app selected in an app campaign
Ad Account ID	The account that owns and pays for campaigns	Meta Ads Manager and business asset access; it does not go in the mobile SDK
Pixel ID	A website tracking source	Website Pixel or web Conversions API setup, if you measure website activity

It is normal for all three numbers to differ. The important comparison is the Meta App ID inside the Android app versus the App ID selected for the campaign. If those point to different Meta apps, the campaign will not use the events from the SDK integration I tested.

Ad account runs an app campaign and selects a Meta app
                         ↓
Someone interacts with that ad and installs or opens the app
                         ↓
The app's SDK sends Activate App, Search, Purchase, etc. to its Meta App ID
                         ↓
Meta applies its attribution rules to eligible ad interactions and app events

The app sends events to Meta, not directly to the ad account. Meta already knows which account ran the campaign. An event arriving in Events Manager proves that event collection works; it does not, by itself, prove a campaign received credit for the event.

What I needed before writing code

A Meta for Developers app for the real mobile app, with its App ID and Client Token.
The Android package name and launch activity from the production app, plus its Play Store listing.
The Android signing key hashes for builds I would test and distribute.
A Meta business/ad account that can access the registered app.
A test Android device and a build containing the SDK.

I kept the App ID and Client Token from the same Meta app. The website Pixel ID was not used in Android configuration.

Facebook Login is not required for App Events. The booking app can report opens and purchases without asking customers to sign in with Facebook.

For my TRAVLER Android build, the production package is com.ma3app, the launch activity is com.ma3app.MainActivity, and the SDK App ID is 1320645970220890. I compare that last number with the app selected in Ads Manager. The Client Token comes from the root .env at build time; its value does not belong in this post.

Step 1: Register the Android app with Meta

In Meta for Developers → My Apps, open the intended app. Under its app settings, add the Android platform and enter the app's package name, the fully qualified activity that opens it, and the relevant store details. In this Flutter project, the package and activity are represented by applicationId in android/app/build.gradle.kts and MainActivity in the Android source. Verify them from the release build rather than guessing from a sample manifest.

Copy the App ID from the developer app settings. Find the Client Token in that same app's advanced/security settings. Meta's menu names can move, so the important check is the app shown at the top of each settings page.

Signing key hashes

Meta's Android platform configuration asks for Android key hashes. Add the development hash for local debug builds and the hash of the certificate that signs the app users actually download. If Google Play App Signing signs the distributed APKs, use its App Signing certificate, not just your upload key.

For the standard Android debug keystore, a key hash can be calculated with:

keytool -exportcert -alias androiddebugkey \
  -keystore "$HOME/.android/debug.keystore" \
  -storepass android -keypass android \
  | openssl sha1 -binary | openssl base64

For an exported DER certificate from Play Console:

openssl x509 -inform DER -in play_app_signing.der -outform DER \
  | openssl sha1 -binary | openssl base64

The result is a Base64 SHA-1 key hash. It is different from the SHA-256 fingerprint used in Android App Links' assetlinks.json. Those two values solve different problems and cannot be substituted for each other.

Step 2: Add the Android SDK to Flutter's native project

The Flutter UI does not initialize Meta's Android SDK by itself. I added Meta's core Android dependency to android/app/build.gradle.kts:

dependencies {
    implementation("com.facebook.android:facebook-core:19.0.0")
}

19.0.0 is the version this project was built and tested with; check Meta's current release before using the snippet in a new project. Gradle must be able to resolve it from Maven Central.

The project's root .env contains the client token:

META_CLIENT_TOKEN=YOUR_CLIENT_TOKEN_FROM_THE_SAME_META_APP

Flutter's Dart .env loader does not automatically place that value into Android resources. The native Gradle build reads the file and generates a string resource. A shortened version of the approach is:

val metaClientToken = rootProject.file("../.env").readLines()
    .first { it.trimStart().startsWith("META_CLIENT_TOKEN=") }
    .substringAfter("=").trim().trim('"', '\'')

android {
    defaultConfig {
        resValue("string", "facebook_client_token", metaClientToken)
    }
}

In production code, fail the build if the value is missing and support an environment variable in CI. Keep .env out of Git. This keeps the token out of source control, but it is still packaged into the Android app; a local .env is not a secret vault for values shipped to a device.

I put the App ID in android/app/src/main/res/values/strings.xml:

<resources>
    <string name="facebook_app_id">YOUR_META_APP_ID</string>
</resources>

Then I added the metadata inside <application> in android/app/src/main/AndroidManifest.xml:

<uses-permission android:name="android.permission.INTERNET" />

<application ...>
    <meta-data
        android:name="com.facebook.sdk.ApplicationId"
        android:value="@string/facebook_app_id" />
    <meta-data
        android:name="com.facebook.sdk.ClientToken"
        android:value="@string/facebook_client_token" />
    <meta-data
        android:name="com.facebook.sdk.AutoLogAppEventsEnabled"
        android:value="true" />
    <meta-data
        android:name="com.facebook.sdk.AutoLogMetaDataEnabled"
        android:value="false" />
</application>

With valid manifest metadata, Meta's Android library initializes automatically. With automatic App Events enabled, it also logs app activation; I did not add a second manual activateApp() call. The SDK's own source documents this behavior. Also check the automatic App Events setting in Meta Events Manager, because Meta says both the client setting and the Events Manager setting affect automatic logging.

This project also sets FacebookSdk.setGraphApiVersion("v24.0") before creating its logger because the tested SDK version otherwise used an older Graph API version. That is a project-specific compatibility setting. Recheck it when upgrading the SDK or when Meta changes supported API versions.

Step 3: Decide exactly what each event means

Tracking is only useful if an event fires at a meaningful point. I mapped the booking flow before writing the Flutter calls:

Event	Type	When it fires	What it tells me
`fb_mobile_activate_app`	Automatic	SDK observes an app session	The app was opened; this is not a ticket sale
`travler_home_view`	Custom	Booking home becomes visible	Entry into the booking flow
`travler_search_screen_view`	Custom	Search/results screen opens	User reached the search stage
`fb_mobile_search`	Standard Search	User submits a route search	Intent to find a trip
`travler_search_results_view`	Custom	Results load, with `result_count`	Search succeeded, including zero results
`travler_search_results_error`	Custom	Results request fails	A technical drop-off point
`fb_mobile_initiated_checkout`	Standard Initiated Checkout	Payments page opens with a valid amount	User reached checkout
`fb_mobile_purchase`	Standard Purchase	Payment is confirmed successful	A paid ticket conversion

The standard events use Meta's event constants or its logPurchase API. The custom names are specific to this app. A Purchase must not fire when someone merely taps Pay, opens a pending booking, or sees a payment request. It fires after the payment-success path confirms the booking was paid.

For accurate interpretation, do not treat raw event totals as a perfect person-by-person funnel. One user can search several times, return to checkout, or reopen the app. Use the counts to locate likely drop-offs, then compare unique users or sessions in a suitable analytics report before calculating conversion rates.

Step 4: Bridge Flutter actions to native App Events

I used a Flutter MethodChannel because this project was adding Android tracking first. The Dart side invokes a named action; MainActivity maps that action to Meta's Android logger. Both sides must use the same channel name and method names.

A reduced Dart example:

import 'package:flutter/foundation.dart';
import 'package:flutter/services.dart';

class MetaEvents {
  static const _channel = MethodChannel('com.ma3app/meta_app_events');

  static bool get _android =>
      !kIsWeb && defaultTargetPlatform == TargetPlatform.android;

  static Future<void> searchSubmitted() async {
    if (_android) await _channel.invokeMethod('logSearchSubmitted');
  }

  static Future<void> purchase({
    required String bookingId,
    required double amount,
    required String currency,
  }) async {
    if (!_android || amount <= 0) return;
    await _channel.invokeMethod('logPurchase', {
      'bookingId': bookingId,
      'amount': amount,
      'currency': currency,
    });
  }
}

The native handler creates an AppEventsLogger and maps these calls to standard or custom events. The relevant Android calls look like this:

val events = AppEventsLogger.newLogger(applicationContext)

// Search submitted:
events.logEvent(AppEventsConstants.EVENT_NAME_SEARCHED)

// Checkout started with a valid positive amount:
events.logEvent(
    AppEventsConstants.EVENT_NAME_INITIATED_CHECKOUT,
    amount,
    Bundle().apply {
        putString(AppEventsConstants.EVENT_PARAM_CURRENCY, currencyCode)
    },
)

// Payment confirmed with a valid positive amount:
events.logPurchase(
    BigDecimal.valueOf(amount),
    Currency.getInstance(currencyCode),
)

The actual channel handler validates numeric amounts and ISO currency codes, returns Flutter errors for invalid arguments, and logs the extra screen/result events. It also keeps purchase deduplication keyed by booking reference on the device, so two success callbacks do not log two purchases for one booking. Event delivery is asynchronous: a successful method call means the native logger accepted the event, while the SDK may flush it to Meta later.

Only pass parameters needed for measurement. Do not send names, phone numbers, payment credentials, access tokens, or raw logs as event parameters. If a booking reference can identify a customer, keep it locally for deduplication unless there is a reviewed reason to transmit it.

Step 5: Connect the registered app to campaigns

In Meta Business settings, find the registered mobile app and make it available to the ad account that will run campaigns. In Ads Manager, create an app campaign, select the Android app, and confirm that the selected App ID matches the SDK App ID. Select an available performance goal/event appropriate to the campaign; event optimization options can depend on the app's eligibility and event volume.

For install campaigns, the app and its store listing must be correct. For ticket-sale campaigns, the app must actually send paid Purchase events. A Pixel ID is relevant if a separate campaign sends people to the website and measures purchases there; it does not replace the native app's App ID.

Step 6: Test in three layers

A. Confirm local SDK initialization

Run a build that contains the integration. In a debug build, I log four booleans without printing the token itself:

initialized=true autoLog=true appIdMatches=true clientTokenPresent=true

appIdMatches compares the SDK's loaded ID to the Android resource. It does not prove that I selected the correct app in Ads Manager.

B. Confirm an event is created and sent

Open the app and use Android logcat. One focused command is:

adb logcat -s \
  TravlerMetaSDK:I \
  FacebookSDK.AppEvents:D \
  FacebookSDK.com.facebook.appevents.AppEventQueue:D

For my Android test build, the logs showed fb_mobile_activate_app, then Result: Success after an App Events flush. They also showed travler_home_view and another successful flush. That is strong evidence the SDK initialized and reported successful delivery. It does not yet prove that a Purchase event was sent or that any campaign received credit.

Logcat can include device IDs and other telemetry. Extract only the event names and send results when sharing a diagnostic log.

C. Confirm the right event appears in Meta

In Events Manager, select the app data source for the same App ID, not the website Pixel. Check Test events or the app's event overview for Activate App, Search, Initiated Checkout, and Purchase as you trigger each stage. For Purchase, complete a legitimate test payment on a build with the integration and verify the amount and currency.

Finally, test a campaign that selects that same app. Organic or debug events may appear in Events Manager without showing as ad-attributed conversions in Ads Manager. Attribution requires an eligible ad interaction and follows Meta's reporting rules. A local Result: Success is a delivery check, not a campaign ROI result.

Troubleshooting checklist

Ad Account ID and App ID differ: Expected. Do not copy the Ad Account ID into Android resources.
Pixel ID and App ID differ: Expected. Check the app data source for native app events.
Campaign selects a different App ID: Give the ad account access to the correct app and select it, or reconfigure the SDK with the intended app's App ID and matching Client Token and ship a new build. Events already sent to the old app do not move automatically.
No Activate App locally: Check that the installed build has the SDK, the manifest has the correct values, and automatic App Events are enabled. Do not add a duplicate manual activation call without first checking the SDK configuration.
Activate App appears, but Purchase does not: Check the actual payment-success callbacks, amount validation, and booking deduplication. Opening the payments page only tests Initiated Checkout.
Events Manager has Purchase, but Ads Manager has no conversions: Check the campaign's selected app, business access, release build, ad interaction, and attribution settings. A test purchase with no Meta ad interaction is not an ad-attributed purchase.
Debug works, production does not: Check the release signing certificate/key hash, Play distribution, package name, app version, and build-time Client Token. Test the distributed release on a physical device.

The rule I keep returning to is simple: the Android SDK and the app selected in the Meta campaign must refer to the same Meta App ID. The Ad Account ID identifies who runs the ads; the Pixel ID is for website measurement.

References

Apple Watch & iMessage Integration in Flutter

Michael Otieno Olang — Thu, 09 Jul 2026 09:01:50 +0000

A Complete Developer Guide

App Bundle ID: com.example.demoapp
App Group: group.com.example.demoapp
Targets: Runner (iPhone) · DemoWatch Watch App · DemoMessages MessagesExtension

Architecture Overview
Dependencies Added
Xcode Setup (One-Time)
Apple Watch Integration
- 4.1 Flutter Side — WatchService
- 4.2 Syncing Data to the Watch
- 4.3 Listening for Watch Actions in Flutter
- 4.4 Native Watch UI (SwiftUI)
- 4.5 Watch Face Complications
iMessage Integration
- 5.1 Flutter Side — IMessageSyncService
- 5.2 Syncing Trip Data for iMessage
- 5.3 Native iMessage UI (UIKit/Swift)
Data Flow Diagrams
Publishing to the App Store
Build & Archive Checklist
Troubleshooting & Challenges Experienced

1. Architecture Overview

Flutter cannot run its UI engine on Apple Watch or inside iMessage extensions. Instead, we use two communication bridges:

Extension	Bridge Technology	Direction
Apple Watch	`WatchConnectivity` framework via `watch_connectivity` Flutter package	iPhone ↔ Watch (two-way, real-time)
iMessage	`App Groups` shared `UserDefaults` container via `shared_preference_app_group` package	Flutter → iMessage (one-way, cached)

┌─────────────────────┐         WatchConnectivity          ┌─────────────────────┐
│   Flutter App        │  ◄──────────────────────────────►  │  DemoWatch App   │
│   (iPhone)           │                                     │  (Apple Watch)      │
└─────────────────────┘                                     └─────────────────────┘
          │
          │  App Groups (UserDefaults)
          │  group.com.example.demoapp
          ▼
┌─────────────────────┐
│  iMessage Extension  │
│  DemoMessages      │
└─────────────────────┘

2. Dependencies Added

The following packages were added to pubspec.yaml:

dependencies:
  watch_connectivity: ^0.2.8        # Apple Watch two-way communication
  shared_preference_app_group: ^2.1.0  # Shared container for iMessage

Install with:

flutter pub get

3. Xcode Setup (One-Time)

3.1 App Groups Capability

App Groups allow all three targets to share a single data container (group.com.example.demoapp).

You must add this capability to each target in Xcode:

Open ios/Runner.xcworkspace in Xcode.
In the Project Navigator (left panel), select Runner target.
Go to Signing & Capabilities tab.
Click + Capability → App Groups.
Add: group.com.example.demoapp
Repeat steps 2–5 for DemoWatch Watch App target.
Repeat steps 2–5 for DemoMessages MessagesExtension target.

✅ Confirmation: Check the entitlements file at
ios/DemoWatch Watch App/DemoWatch Watch App.entitlements — it should contain:
<key>com.apple.security.application-groups</key>
<array>
    <string>group.com.example.demoapp</string>
</array>

3.2 Complication Data Source (Apple Watch only)

To enable watch face complications:

Select the DemoWatch Watch App target in Xcode.
Go to the Info tab.
Add a new row with key: CLKComplicationDataSource
Set value to: ComplicationController

3.3 Watch Target Platform Settings

The Watch target must resolve as a watchOS target during archive. If Xcode resolves it as iphoneos, the Watch asset catalog will be compiled as an iOS asset catalog and the archive will fail with:

Assets.xcassets: The stickers icon set, app icon set, or icon stack named "AppIcon" did not have any applicable content.

For the DemoWatch Watch App target, confirm these build settings in Debug, Release, and Profile:

Setting	Required value
`SDKROOT`	`watchos`
`SUPPORTED_PLATFORMS`	`watchos watchsimulator`
`TARGETED_DEVICE_FAMILY`	`4`
`ASSETCATALOG_COMPILER_APPICON_NAME`	`AppIcon`
`ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME`	`AccentColor`

The current project pins these in ios/Runner.xcodeproj/project.pbxproj. This matters because the project-level Flutter/iOS configuration sets SDKROOT = iphoneos and SUPPORTED_PLATFORMS = iphoneos; the Watch target must explicitly override that inherited iOS platform.

You can verify the resolved target settings with:

xcodebuild -showBuildSettings \
  -project ios/Runner.xcodeproj \
  -scheme "DemoWatch Watch App" \
  -configuration Release \
  -destination "generic/platform=watchOS" \
  -derivedDataPath /tmp/travler-derived-data \
  | rg "PLATFORM_NAME|SDKROOT|SUPPORTED_PLATFORMS|TARGETED_DEVICE_FAMILY|BUILT_PRODUCTS_DIR"

Expected output should include:

BUILT_PRODUCTS_DIR = .../Release-watchos
PLATFORM_NAME = watchos
SDKROOT = .../WatchOS.platform/.../WatchOS*.sdk
SUPPORTED_PLATFORMS = watchos watchsimulator
TARGETED_DEVICE_FAMILY = 4

3.4 Watch AppIcon Asset Catalog

The Watch app icon set lives at:

ios/DemoWatch Watch App/Assets.xcassets/AppIcon.appiconset

Contents.json must declare watch-specific icon slots, not only the 1024 marketing icon. The catalog should include these families:

Role	Sizes currently covered
`notificationCenter`	24x24, 27.5x27.5, 33x33
`companionSettings`	29x29 at 2x and 3x
`appLauncher`	40x40, 44x44, 46x46, 50x50, 51x51, 54x54
`quickLook`	86x86, 98x98, 108x108, 117x117, 129x129
`watch-marketing`	1024x1024

If new icon artwork is generated, preserve the filenames declared in Contents.json or update the JSON and PNGs together. A missing filename, wrong idiom, or iOS-only icon set will break archive.

4. Apple Watch Integration

4.1 Flutter Side — WatchService

File: lib/services/watch_service.dart

This service is the bridge between your Flutter app and the Apple Watch.

import 'dart:async';
import 'package:flutter/foundation.dart';
import 'package:watch_connectivity/watch_connectivity.dart';

class WatchService {
  final WatchConnectivity _watch = WatchConnectivity();
  StreamSubscription<Map<String, dynamic>>? _messageSubscription;

  // All raw messages from the Watch
  final _messageController = StreamController<Map<String, dynamic>>.broadcast();
  Stream<Map<String, dynamic>> get messageStream => _messageController.stream;

  // Only action commands from the Watch (e.g., quick_book, cancel_booking)
  final _actionController = StreamController<Map<String, dynamic>>.broadcast();
  Stream<Map<String, dynamic>> get actionStream => _actionController.stream;

  WatchService() {
    _messageSubscription = _watch.messageStream.listen((message) {
      _messageController.add(message);
      if (message.containsKey('action')) {
        _actionController.add(message);
      }
    });
  }

  Future<bool> isSupported() async => await _watch.isSupported;
  Future<bool> isReachable() async => await _watch.isReachable;

  void dispose() {
    _messageSubscription?.cancel();
    _messageController.close();
    _actionController.close();
  }
}

4.2 Syncing Data to the Watch

Call syncTravelData() whenever the user's data changes — after login, booking, or wallet top-up. The data is sent using Application Context, which means the Watch receives the latest state even if it was not connected at the time.

final watchService = WatchService();

await watchService.syncTravelData(
  walletBalance: 125.50,
  walletCurrency: 'Ksh',
  nextTripDestination: 'Nairobi → Mombasa',
  nextTripDate: 'Aug 12, 2026',
  nextTripTime: '08:30 AM',
  nextTripSeat: '14B',
  qrCodeData: 'TICKET-XYZ-12345',  // the raw ticket/QR string
  activeBookingsCount: 2,
  unreadNotifications: 3,
);

Best places to call this:

After a successful booking API response
After the user tops up their wallet
In your home screen initState() when the app opens

4.3 Listening for Watch Actions in Flutter

When the user presses Quick Book or Cancel on the Apple Watch, the Watch sends a message to Flutter via actionStream. Listen to this in your BLoC, provider, or main widget tree:

final watchService = WatchService();

watchService.actionStream.listen((actionData) {
  final action = actionData['action'] as String?;

  switch (action) {
    case 'quick_book':
      // Trigger your booking flow / open the booking screen
      NavigationKeys.mainNav.currentState?.pushNamed('/booking');
      break;

    case 'cancel_booking':
      final destination = actionData['destination'] as String?;
      // Call your cancel API
      context.read<BookingBloc>().add(CancelBookingEvent(destination: destination));
      break;
  }
});

4.4 Native Watch UI (SwiftUI)

File: ios/DemoWatch Watch App/ContentView.swift

The Watch app has a 4-tab swipeable interface. Each tab is a SwiftUI view powered by WatchViewModel:

Tab	View	Content
1	`TripDashboardView`	Next trip destination, date, time, seat + Quick Book & Cancel buttons
2	`TicketQRView`	Auto-generated QR code scannable at the boarding point
3	`WalletView`	Wallet balance + active bookings count
4	`SupportNotificationsView`	Call Support button + unread notification count

File: ios/DemoWatch Watch App/WatchViewModel.swift

The WatchViewModel is the native Swift equivalent of WatchService. It implements WCSessionDelegate to receive data from Flutter and manages all published state for the SwiftUI views.

// How the Watch receives data from Flutter:
func session(_ session: WCSession, didReceiveApplicationContext applicationContext: [String : Any]) {
    DispatchQueue.main.async {
        self.parseData(applicationContext)
    }
}

// How the Watch sends actions back to Flutter:
func sendActionToFlutter(action: String, payload: [String: Any] = [:]) {
    var message = payload
    message["action"] = action
    if session.isReachable {
        session.sendMessage(message, replyHandler: nil, errorHandler: nil)
    }
}

4.5 Watch Face Complications

File: ios/DemoWatch Watch App/ComplicationController.swift

Complications display DemoTravel info right on the Apple Watch clock face — without the user needing to open the app.

Supported complication families:

Family	Watch Face	What's Shown
`graphicCorner`	Infograph	`🚌 Mombasa` + departure time
`graphicCircular`	Infograph Modular	Bus icon + time
`graphicBezel`	Infograph	Circle with full destination curved around it
`modularLarge`	Modular	3-row table: Trip / Time / Seat
`utilitarianLarge`	Utility	`🚌 Nairobi → Mombasa · 08:30`
`utilitarianSmall`	Utility	`🚌 08:30`
`modularSmall`	Modular	`Bus` + time
`circularSmall`	Color / Chronograph	`Bus` + time

How complications stay up to date:

When WatchViewModel.parseData() receives new data from Flutter, it automatically:

Writes the data to UserDefaults(suiteName: "group.com.example.demoapp")
Calls CLKComplicationServer.sharedInstance().reloadTimeline(for:) on all active complications

This means the watch face updates instantly every time you call syncTravelData() from Flutter.

The ComplicationController reads from UserDefaults:

let defaults = UserDefaults(suiteName: "group.com.example.demoapp")
let destination = defaults?.string(forKey: "nextTripDestination") ?? "No Trip"
let time        = defaults?.string(forKey: "nextTripTime") ?? "--"
let seat        = defaults?.string(forKey: "nextTripSeat") ?? "--"

5. iMessage Integration

5.1 Flutter Side — IMessageSyncService

File: lib/services/imessage_sync_service.dart

This service writes trip and wallet data into the shared App Group container so the iMessage extension can read them in Swift.

import 'dart:convert';
import 'package:shared_preference_app_group/shared_preference_app_group.dart';

const String _kAppGroup = 'group.com.example.demoapp';

class DemoTrip {
  final String id;
  final String destination;
  final String origin;
  final String date;
  final String time;
  final String seat;
  final String qrCodeData;

  DemoTrip({
    required this.id,
    required this.destination,
    required this.origin,
    required this.date,
    required this.time,
    required this.seat,
    required this.qrCodeData,
  });

  Map<String, dynamic> toJson() => {
    'id': id,
    'destination': destination,
    'origin': origin,
    'date': date,
    'time': time,
    'seat': seat,
    'qrCodeData': qrCodeData,
  };
}

class IMessageSyncService {
  static const String _tripsKey  = 'demo_imessage_trips';
  static const String _walletKey = 'demo_imessage_wallet';

  // Call once at app startup (e.g. in main.dart)
  Future<void> init() async {
    await SharedPreferenceAppGroup.setAppGroup(_kAppGroup);
  }

  Future<void> syncAll({
    required List<DemoTrip> trips,
    required double walletBalance,
    required String walletCurrency,
  }) async {
    await syncTrips(trips);
    await syncWalletBalance(walletBalance, walletCurrency);
  }

  Future<void> syncTrips(List<DemoTrip> trips) async {
    final encoded = jsonEncode(trips.map((t) => t.toJson()).toList());
    await SharedPreferenceAppGroup.setString(_tripsKey, encoded);
  }

  Future<void> syncWalletBalance(double balance, String currency) async {
    await SharedPreferenceAppGroup.setString(
      _walletKey,
      jsonEncode({'balance': balance, 'currency': currency}),
    );
  }
}

5.2 Syncing Trip Data for iMessage

Step 1 — Initialise once at app startup (e.g., in main.dart before runApp):

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // ... existing initialisation ...

  // Initialise iMessage sync
  final iMessageSync = IMessageSyncService();
  await iMessageSync.init();

  runApp(const MyApp());
}

Step 2 — Sync whenever data changes:

final iMessageSync = IMessageSyncService();

await iMessageSync.syncAll(
  walletBalance: 125.50,
  walletCurrency: 'Ksh',
  trips: [
    DemoTrip(
      id: 'booking-001',
      origin: 'Nairobi',
      destination: 'Mombasa',
      date: 'Aug 12, 2026',
      time: '08:30 AM',
      seat: '14B',
      qrCodeData: 'TICKET-XYZ-12345',
    ),
    DemoTrip(
      id: 'booking-002',
      origin: 'Mombasa',
      destination: 'Nairobi',
      date: 'Aug 15, 2026',
      time: '02:00 PM',
      seat: '7A',
      qrCodeData: 'TICKET-ABC-67890',
    ),
  ],
);

5.3 Native iMessage UI (UIKit/Swift)

File: ios/DemoMessages MessagesExtension/MessagesViewController.swift

The iMessage extension is built with UIKit. It:

Reads trip and wallet data from UserDefaults(suiteName: "group.com.example.demoapp")
Displays a scrollable list of upcoming trips
When a trip is tapped, inserts a rich MSMessage bubble into the chat

Reading from the shared container in Swift:

let defaults = UserDefaults(suiteName: "group.com.example.demoapp")

// Read trips
if let tripsString = defaults?.string(forKey: "demo_imessage_trips"),
   let data = tripsString.data(using: .utf8),
   let rawList = try? JSONSerialization.jsonObject(with: data) as? [[String: Any]] {
    trips = rawList.compactMap { DemoTrip(dict: $0) }
}

// Read wallet
if let walletString = defaults?.string(forKey: "demo_imessage_wallet"),
   let data = walletString.data(using: .utf8),
   let dict = try? JSONSerialization.jsonObject(with: data) as? [String: Any] {
    walletBalance  = dict["balance"]  as? Double ?? 0
    walletCurrency = dict["currency"] as? String ?? "Ksh"
}

Sending a rich iMessage bubble:

func sendTrip(_ trip: DemoTrip) {
    guard let conversation = currentConversation else { return }

    let message = MSMessage(session: conversation.selectedMessage?.session ?? MSSession())
    let layout  = MSMessageTemplateLayout()

    layout.caption             = "🚌 \(trip.origin) → \(trip.destination)"
    layout.subcaption          = "\(trip.date) at \(trip.time)"
    layout.trailingCaption     = "Seat \(trip.seat)"
    layout.trailingSubcaption  = "Trip Booking"
    layout.image               = generateQRImage(from: trip.qrCodeData)  // QR code

    message.layout = layout
    message.url    = URL(string: "https://example.com")!

    conversation.insert(message, completionHandler: nil)
}

Important: do not name your stored conversation property activeConversation. MSMessagesAppViewController already exposes an inherited activeConversation property. Use a separate name such as:

private var currentConversation: MSConversation?

override func willBecomeActive(with conversation: MSConversation) {
    currentConversation = conversation
    loadData()
}

What the recipient sees:

The recipient sees a custom rich bubble in their chat containing:

🚌 Nairobi → Mombasa (caption)
Aug 12, 2026 at 08:30 AM (subcaption)
Seat 14B (trailing)
QR code image embedded in the bubble

6. Data Flow Diagrams

Apple Watch — Data Flow

Flutter (Dart)                        Apple Watch (Swift)
─────────────────                     ────────────────────
WatchService.syncTravelData()
        │
        │  WatchConnectivity
        │  updateApplicationContext()
        │ ─────────────────────────►  WatchViewModel.didReceiveApplicationContext()
        │                                      │
        │                                      ├──► Updates @Published UI state
        │                                      ├──► Persists to UserDefaults (App Group)
        │                                      └──► Reloads watch face complications
        │
        │  WCSession.sendMessage()
        │ ◄─────────────────────────  WatchViewModel.sendActionToFlutter()
        │           (user taps Quick Book / Cancel on Watch)
        │
WatchService.actionStream emits
        │
        └──► Your BLoC / Provider handles the action

iMessage — Data Flow

Flutter (Dart)                        iMessage Extension (Swift)
─────────────────                     ──────────────────────────
IMessageSyncService.syncAll()
        │
        │  UserDefaults
        │  (suiteName: group.com.example.demoapp)
        │ ─────────────────────────►  MessagesViewController.loadData()
        │                                      │
        │                                      ├──► Renders trip list
        │                                      └──► User taps trip → sends MSMessage bubble
        │
        │  (No return path — iMessage is one-way)

7. Publishing to the App Store

✅ Good news: The Apple Watch and iMessage extensions are bundled inside your main iOS app. You do not submit them separately. When users download DemoTravel from the App Store, the Watch app automatically installs on their paired Apple Watch.

Step-by-step publishing process:

Step 1 — Archive the app:

flutter build ipa

Or in Xcode: Product → Archive (with "Any iOS Device" selected as the destination).

Step 2 — Open Xcode Organizer:
After archiving, Xcode Organizer opens automatically. Select your archive and click Distribute App.

Step 3 — Upload to App Store Connect:
Choose App Store Connect → Upload. Follow the prompts. The Watch and iMessage extensions are included automatically.

Step 4 — Add Apple Watch Screenshots:
In App Store Connect, navigate to your app listing. You will now see a section for Apple Watch Screenshots. Take screenshots from the Watch Simulator in Xcode and upload them here. Apple requires these before the app can be reviewed.

Required Watch screenshot sizes:

40mm: 394 × 324 px
41mm: 352 × 430 px (Series 7/8/9)
44mm: 368 × 448 px
45mm: 396 × 484 px

Step 5 — Submit for Review:
Once screenshots are uploaded and everything looks good, click Submit for Review. Apple reviews the Watch and iMessage extensions as part of the same review process.

8. Build & Archive Checklist

Use this checklist before creating an App Store or TestFlight archive that includes Apple Watch and iMessage targets.

8.1 Before archiving

Open ios/Runner.xcworkspace, not ios/Runner.xcodeproj, when using Xcode manually.
Confirm the Runner scheme includes dependencies on:
- DemoWatch Watch App
- DemoMessages MessagesExtension
Confirm DemoWatch Watch App resolves as watchOS:
- PLATFORM_NAME = watchos
- BUILT_PRODUCTS_DIR contains Release-watchos
- SUPPORTED_PLATFORMS = watchos watchsimulator
Confirm DemoMessages MessagesExtension resolves as iPhoneOS:
- PLATFORM_NAME = iphoneos
- PRODUCT_TYPE = com.apple.product-type.app-extension.messages
Confirm all targets share the App Group:
- Runner
- DemoWatch Watch App
- DemoMessages MessagesExtension

8.2 Useful build-only verification

This command checks the Watch and iMessage target build path without running tests or static analysis:

xcodebuild build \
  -project ios/Runner.xcodeproj \
  -scheme "DemoWatch Watch App" \
  -configuration Release \
  -destination "generic/platform=watchOS" \
  -derivedDataPath /tmp/travler-derived-data \
  CODE_SIGNING_ALLOWED=NO

Successful Watch asset catalog output looks like:

CompileAssetCatalogVariant ... DemoWatch Watch App/Assets.xcassets
... --app-icon AppIcon --target-device watch --platform watchos
/* com.apple.actool.compilation-results */
.../Assets.car
LinkAssetCatalog ... DemoWatch Watch App/Assets.xcassets
note: Emplaced .../DemoWatch Watch App.app/Assets.car

8.3 What not to run for this workflow

For fast archive debugging, skip:

flutter test
flutter analyze
dart analyze

The archive blockers here are Xcode target configuration, asset catalogs, and native Swift extension compilation. Unit/widget tests and Dart static analysis do not diagnose those issues.

9. Troubleshooting & Challenges Experienced

Watch data not updating?

Make sure syncTravelData() is being called after a booking or login.
Confirm the Watch app is installed on a paired Watch.
On a physical device, both the iPhone and Watch must be connected.
Check that the App Group group.com.example.demoapp is listed in both the Runner and Watch targets in Xcode.

iMessage extension shows "No upcoming trips"?

Make sure IMessageSyncService.init() is called at app startup before any sync calls.
Confirm syncAll() has been called at least once.
Verify the App Group identifier group.com.example.demoapp is set on both Runner and DemoMessages targets.
Double check the key names in Swift (demo_imessage_trips, demo_imessage_wallet) match the constants in Dart.

Watch face complications not appearing?

Confirm CLKComplicationDataSource = ComplicationController is set in the Watch target's Info.plist in Xcode.
Long-press your watch face → Edit → browse Complications for "DemoTravel".
After calling syncTravelData() in Flutter, the complication should update within seconds.

Build error: `No such module 'CoreImage.CIFilterBuiltins'`

This module does not exist on watchOS. Use plain import CoreImage instead.
Use CIFilter(name: "CIQRCodeGenerator") instead of CIFilter.qrCodeGenerator().
Use Image(cgImage:, scale:, label:) in SwiftUI instead of Image(uiImage:).

`pod install` fails with xcodeproj compatibility error?

This is a known CocoaPods issue with Xcode 26+. Run flutter run from the command line instead of pod install directly — Flutter's tooling handles the pod installation correctly.

Archive error: `AppIcon did not have any applicable content`

Symptom:

/ios/DemoWatch Watch App/Assets.xcassets:
The stickers icon set, app icon set, or icon stack named "AppIcon" did not have any applicable content.

Root causes seen in this project:

The Watch target was resolving as iphoneos, so Xcode was trying to compile watch-only icon slots as iOS icons.
The Watch AppIcon.appiconset/Contents.json only exposed watch-marketing content or incomplete watch slots.

Fix:

In ios/Runner.xcodeproj/project.pbxproj, ensure the DemoWatch Watch App target has:

SDKROOT = watchos;
SUPPORTED_PLATFORMS = "watchos watchsimulator";
TARGETED_DEVICE_FAMILY = 4;
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;

In ios/DemoWatch Watch App/Assets.xcassets/AppIcon.appiconset/Contents.json, declare actual idiom: watch entries for notificationCenter, companionSettings, appLauncher, and quickLook, plus watch-marketing.
Confirm every filename referenced by Contents.json exists and has the expected pixel dimensions.

Verification:

jq empty "ios/DemoWatch Watch App/Assets.xcassets/AppIcon.appiconset/Contents.json"
sips -g pixelWidth -g pixelHeight "ios/DemoWatch Watch App/Assets.xcassets/AppIcon.appiconset/"*.png

Then confirm the target is not resolving as iPhoneOS:

xcodebuild -showBuildSettings \
  -project ios/Runner.xcodeproj \
  -scheme "DemoWatch Watch App" \
  -configuration Release \
  -destination "generic/platform=watchOS" \
  -derivedDataPath /tmp/travler-derived-data \
  | rg "PLATFORM_NAME|SDKROOT|SUPPORTED_PLATFORMS|BUILT_PRODUCTS_DIR"

Build error: `No available simulator runtimes for platform watchsimulator`

This can happen when actool runs in a restricted environment or Xcode cannot access simulator runtime services.

Symptoms:

No available simulator runtimes for platform watchsimulator.
SimServiceContext supportedRuntimes=[]

Fix:

Run the build from normal Terminal or Xcode, not a restricted sandbox.
Open Xcode once and let it finish installing components.
Check Xcode → Settings → Platforms and install the required watchOS simulator runtime if missing.
Use a device/generic watchOS destination for archive:

xcodebuild build \
  -project ios/Runner.xcodeproj \
  -scheme "DemoWatch Watch App" \
  -configuration Release \
  -destination "generic/platform=watchOS" \
  -derivedDataPath /tmp/travler-derived-data \
  CODE_SIGNING_ALLOWED=NO

Build error: `activeConversation` override in iMessage extension

Symptom:

overriding property must be as accessible as its enclosing type
cannot override with a stored property 'activeConversation'
ambiguous use of 'activeConversation'

Cause:

MSMessagesAppViewController already has an inherited activeConversation property. A stored property with the same name in MessagesViewController conflicts with it.

Fix:

Rename the custom property:

private var currentConversation: MSConversation?

override func willBecomeActive(with conversation: MSConversation) {
    currentConversation = conversation
    loadData()
}

private func sendTrip(_ trip: DemoTrip) {
    guard let conversation = currentConversation else { return }
    // insert MSMessage...
}

Build reaches `Run Script` and appears stuck

After Watch assets and iMessage compile issues are fixed, the build can spend a long time in Flutter/Xcode script phases, especially Run Script, Thin Binary, or Flutter embed steps.

What to check:

Confirm previous failures are gone before interrupting. In the log, Watch asset success looks like Emplaced .../DemoWatch Watch App.app/Assets.car.
Run from a normal Terminal when possible so script phases can access the full user environment.
If the script is silent for several minutes, rerun with Xcode's report navigator open to see the exact active phase.

Documentation generated for DemoTravel v3.5.4 — Apple Watch & iMessage Integration
This sample project is provided for educational purposes.
Bundle ID: com.example.demoapp · App Group: group.com.example.demoapp

Flutter Apps and Android's 16KB Page Size Requirement: A Complete Developer Guide

Michael Otieno Olang — Thu, 04 Sep 2025 06:44:24 +0000

Google Play Store is rolling out a significant change that every Android developer needs to know about. Starting November 1, 2025, all new apps and app updates targeting Android 15+ must be compatible with 16KB memory pages. This requirement has caught many developers off guard, especially those working with Flutter applications.
In this comprehensive guide, we'll dive deep into what this means, why it's happening, and most importantly, how to ensure your Flutter apps are ready.

Understanding Memory Page Sizes
Memory pages are fixed-size blocks of virtual memory that the operating system uses to manage RAM efficiently. Think of them as standardized containers for data that help the OS organize and access memory. For years, Android devices have predominantly used 4KB page sizes. This worked well for devices with limited RAM, but as smartphones evolved with more memory and processing power, larger page sizes became beneficial.

Why 16KB Pages?
The shift to 16KB pages isn't arbitrary.
Here's what the research shows:

Faster App Launches: Up to 30% improvement in cold start times
Better Memory Efficiency: Reduced memory fragmentation
Improved System Performance: Faster boot times and overall responsiveness
Enhanced Battery Life: More efficient memory management reduces CPU overhead

Step-by-Step Implementation Guide
1.Update Flutter SDK

# Check current version
flutter --version

# Update to latest stable
flutter upgrade

# Verify you're on the latest stable channel
flutter channel stable
flutter upgrade

Minimum recommended versions:

Flutter SDK: 3.16.0 or later
Dart SDK: 3.2.0 or later

2.Update Android Gradle Plugin (AGP)
In your android/build.gradle:

buildscript {
    ext.kotlin_version = '1.9.10'
    dependencies {
        // Update to AGP 8.5.0 or later
        classpath 'com.android.tools.build:gradle:8.1.0'
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
    }
}

3.Update Android NDK
In android/app/build.gradle:

android {
    compileSdkVersion 35
    ndkVersion "28.x.xxxxxxx" 

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}

4.Dependency Audit
Check if you have the latest versions of every dependency in the pubspec.yaml file

Critical Plugins to Check

Focus on these plugin categories:
Camera/Media: camera, image_picker, video_player
Database: sqflite, hive, objectbox
Networking: diowith native interceptors
Firebase: All Firebase plugins
Maps: google_maps_flutter
Payment: stripe_android, payment gateway SDKs

Navigating the Journey: Becoming a Mobile App Developer

Michael Otieno Olang — Sun, 31 Mar 2024 15:42:25 +0000

We'll embark on a journey together into the realm of mobile app development. In today's digital age, mobile applications have become an integral part of our daily lives, from communication and entertainment to productivity and commerce. If you've ever wondered what it takes to create these innovative tools that reside in our pockets, you're in the right place. In this guide, we'll explore the steps, tools, and resources you need to kickstart your career as a mobile app developer.

Understanding the Landscape:

Before diving into the technical aspects, it's crucial to grasp the landscape of mobile app development. Mobile platforms such as iOS and Android dominate the market, each with its own set of development tools, languages, and guidelines. Additionally, cross-platform frameworks like React Native and Flutter offer the ability to build apps for multiple platforms using a single codebase. Understanding these options will help you chart your path forward.

Learning the Fundamentals:

As with any craft, mastering the fundamentals is essential for success. Start by familiarizing yourself with programming languages commonly used in mobile app development, such as Java, Kotlin, Swift, or Dart. Online platforms like Codecademy, Udemy, and Coursera offer comprehensive courses tailored to beginners.

Choosing Your Platform:

Once you've gained a solid understanding of programming fundamentals, it's time to choose your platform. Are you drawn to the sleek design and user experience of iOS apps, or do you prefer the flexibility and customization options of Android? Your decision will influence the tools and technologies you'll need to learn next.

Exploring Development Tools:

Equipped with a programming language and platform of choice, it's time to explore the development tools available to you. For iOS development, Xcode is the primary Integrated Development Environment (IDE) used by developers, while Android Studio is the go-to choice for Android development. Additionally, familiarize yourself with version control systems like Git, which are indispensable for collaborative development.

Mastering Mobile UI/UX Design:

In the competitive world of mobile apps, user interface (UI) and user experience (UX) design play a crucial role in determining the success of your app. Learn the principles of mobile UI/UX design, including navigation patterns, typography, and usability testing. Tools like Sketch, Figma, and Adobe XD can aid in prototyping and designing your app's interface.

Embracing Continuous Learning:

Mobile app development is a dynamic field that constantly evolves with new technologies and trends. Embrace a mindset of continuous learning by staying updated on the latest developments, attending conferences, and participating in online communities. Engage with fellow developers, seek mentorship, and don't be afraid to experiment with new ideas.

Building Your Portfolio:

As you gain proficiency in mobile app development, start building a portfolio of projects to showcase your skills to potential employers or clients. Whether it's a personal project, freelance work, or contributions to open-source projects, a strong portfolio demonstrates your capabilities and passion for the craft.

Excited to share insights on Android Development Testing!

Michael Otieno Olang — Mon, 11 Mar 2024 08:55:59 +0000

In the world of mobile app development, ensuring seamless user experiences is paramount. That's why Testing on Android development holds such crucial significance. 🛠️

Here are some key points I'd like to highlight:

1️⃣ Unit Testing: Building robust and reliable code starts here. Unit testing allows developers to test individual components in isolation, ensuring they function as expected.

2️⃣ Integration Testing: Assembling the pieces of your app? Integration testing ensures that these components work together seamlessly, catching any potential conflicts or issues.

3️⃣ UI Testing: Your app's interface is the user's gateway to functionality. UI testing verifies that each element behaves as intended, providing a smooth and intuitive experience.

4️⃣ Automation: Embracing automation accelerates testing cycles and enhances efficiency. Tools like Espresso and Robolectric streamline testing processes, enabling developers to focus more on innovation.

5️⃣ Device Fragmentation: Testing across various devices and OS versions is key to ensuring compatibility and performance consistency. Emulators and real-device testing help tackle this challenge effectively.

Incorporating these testing strategies into your Android development workflow not only enhances the quality of your app but also boosts user satisfaction and retention.

A Simple Dart Tutorial

Michael Otieno Olang — Wed, 11 Oct 2023 18:57:32 +0000

Dart Tutorial

Welcome to the Dart Tutorial! This tutorial is designed to help you get started with Dart programming. Whether you're a beginner or an experienced developer, you'll find valuable information here to enhance your skills in Dart.

Dart Tutorial
Table of Contents
Introduction
Prerequisites
Getting Started
Topics Covered
Dart Basics
- 1. Hello, Dart!
- 2. Variables and Data Types
- 3. Control Flow
- 4. Functions
Contributing
Happy coding!

Introduction

Dart is a modern, open-source programming language developed by Google. It's known for its speed, efficiency, and ease of learning. Dart can be used for web, mobile, server, and desktop applications.

This tutorial aims to provide a comprehensive introduction to Dart, covering the basics and gradually progressing to more advanced concepts.

Prerequisites

Before starting this tutorial, make sure you have the following prerequisites:

Basic understanding of programming concepts
Code editor (e.g., Visual Studio Code, IntelliJ IDEA)
Dart SDK installed on your system

If you haven't installed Dart SDK yet, you can download it from the official Dart website.

Getting Started

To get started with Dart, follow these steps:

Install Dart SDK on your system.
Set up your development environment by configuring a code editor (e.g., Visual Studio Code) for Dart.
Clone this repository`

Topics Covered

This tutorial covers the following topics:

Dart basics
Variables and data types
Control flow (if-else, switch, loops)
Functions and error handling

Feel free to explore the code and documentation for each topic in detail.

Dart Basics

1. Hello, Dart!

The traditional "Hello, World!" program in Dart:

dart void main() { print('Hello, Dart!'); }

2. Variables and Data Types

In Dart, you can declare variables using var, int, double, String, bool, and more. Example:
dart void main() { var name = 'John Doe'; // String int age = 30; // Integer double height = 6.2; // Double bool isStudent = true; // Boolean }
Dart is a statically typed language, meaning that variable types are known at compile time. However, you can use var to have Dart infer the type.

3. Control Flow

Dart supports common control flow structures like if, else, switch, and loops (for, while, do-while). Example:

`dart
void main() {
var age = 30;

if (age < 18) {
print('You are a minor.');
} else if (age >= 18 && age < 60) {
print('You are an adult.');
} else {
print('You are a senior citizen.');
}
}
`

4. Functions

Creating a simple function in Dart:

`dart
void main() {
print(greet('John Doe'));
}

String greet(String name) {
  return 'Hello, $name!';
}

`
Dart also supports anonymous functions (functions without a name) and arrow functions (functions with a single expression). Example:

`dart
void main() {
var numbers = [1, 2, 3, 4, 5];

// Anonymous function
numbers.forEach((number) {
print(number);
});

// Arrow function
numbers.forEach((number) => print(number));
}
`

Contributing

If you find any issues or have suggestions for improvement, please feel free to open an issue or create a pull request in my GitHub Repository. We welcome contributions from the community to make this tutorial even better!

To contribute, follow these steps:

Fork the repository.
Create a new branch for your contribution.
Make your changes and commit them.
Push the changes to your fork.
Open a pull request with a detailed description of your contribution.

Happy coding!

My Flutter Journey

Michael Otieno Olang — Thu, 02 Mar 2023 22:14:53 +0000

Flutter is a framework based on dart and developed by google for creating cross-platform applications. It can be used to create android, iOS, Windows, Mac OS, and Linux applications under one code base. It also uses Firebase as its back-end but you can also use the various back-end tech stacks for your back- end such as node js and many others.

I was introduced to flutter 4 months ago by a tech friend who by that time was using Kotlin to develop mobile applications, majorly android applications. We were to create our association's Mobile app within a week and he suggested that for ease and productivity we use the flutter framework for the app. We were both new to the framework but we really wanted to try out this new mobile development technique. We had downloaded a number of YouTube crash courses and some clone apps tutorials.

I never knew what I was doing, I never knew what was happening but I could only follow the YouTube tutor. After some two days, our UI was done and we presented the app as our project

I am still a beginner in the field but these are some of the advantages of Flutter I have noticed so far;

Flutter is easy to learn
Flutter has a great UI design which is simple to implement
Flutter uses widgets
Running Apps is relatively easy
Its beginner friendly

I would really advise you guys to try out Flutter
Thank you

Creating a simple Linked List In C programming

Michael Otieno Olang — Thu, 17 Nov 2022 14:00:57 +0000

Linked Lists are list of elements in which the various elements are linked together. Data in a linked list are stored in a linear manner. The Data are placed in nodes and the nodes are connected in a specific desired fashion.
Node is a container or a box which contains data and other information in it. In a list a node is connected to a different node forming a chain of nodes.
The first step in making a linked list is making a node which will store data into it.
C program for a Linked List
We first create a structure named node which stores an integer named data and a pointer named next to another structure (node).

struct node
{
    int data;
    struct node *next;
};

We then make two nodes (structure named node) and allocating space to them using the malloc function.

struct node *a, *b;
    a = malloc(sizeof(struct node));
    b = malloc(sizeof(struct node));

We then set the values of data of the nodes a and b.

    a->data = 10;
    b->data = 20;

We then store the address of b in the next variable of a. Thus, next of a is now storing the address of b or we can say the next of a is pointing to b.Since there is no node for the next of b, so we are making next of b null.

    a->next = b;
    b->next = NULL;

We then Print to see the output

printf("%d\n%d\n", a->data, a->next->data);

Below is the Combined Code

Shell Programming Using C Programming Language

Michael Otieno Olang — Sat, 11 Jun 2022 18:38:03 +0000

The following C_Program is used to append text from one file to the end of another file. Does any one have an Idea on how I can implement the code using the COMMANDLINE ARGUMENTS and the various FLAGS

A Must have Vs Code Extensions

Michael Otieno Olang — Sat, 28 May 2022 15:39:35 +0000

Gitlens
Better Comments
Prettier
ESLint If there are any,kindly add them comment sections.

DEV Community: Michael Otieno Olang

Meta App Events in Flutter for Android: Setup, Tracking, and Ad Attribution

First, identify the three IDs

What I needed before writing code

Step 1: Register the Android app with Meta

Signing key hashes

Step 2: Add the Android SDK to Flutter's native project

Step 3: Decide exactly what each event means

Step 4: Bridge Flutter actions to native App Events

Step 5: Connect the registered app to campaigns

Step 6: Test in three layers

A. Confirm local SDK initialization

B. Confirm an event is created and sent

C. Confirm the right event appears in Meta

Troubleshooting checklist

References

Apple Watch & iMessage Integration in Flutter

A Complete Developer Guide

Table of Contents

1. Architecture Overview

2. Dependencies Added

3. Xcode Setup (One-Time)

3.1 App Groups Capability

3.2 Complication Data Source (Apple Watch only)

3.3 Watch Target Platform Settings

3.4 Watch AppIcon Asset Catalog

4. Apple Watch Integration

4.1 Flutter Side — WatchService

4.2 Syncing Data to the Watch

4.3 Listening for Watch Actions in Flutter

4.4 Native Watch UI (SwiftUI)

4.5 Watch Face Complications

5. iMessage Integration

5.1 Flutter Side — IMessageSyncService

5.2 Syncing Trip Data for iMessage

5.3 Native iMessage UI (UIKit/Swift)

6. Data Flow Diagrams

Apple Watch — Data Flow

iMessage — Data Flow

7. Publishing to the App Store

Step-by-step publishing process:

8. Build & Archive Checklist

8.1 Before archiving

8.2 Useful build-only verification

8.3 What not to run for this workflow

9. Troubleshooting & Challenges Experienced

Watch data not updating?

iMessage extension shows "No upcoming trips"?

Watch face complications not appearing?

Build error: No such module 'CoreImage.CIFilterBuiltins'

pod install fails with xcodeproj compatibility error?

Archive error: AppIcon did not have any applicable content

Build error: No available simulator runtimes for platform watchsimulator

Build error: activeConversation override in iMessage extension

Build reaches Run Script and appears stuck

Flutter Apps and Android's 16KB Page Size Requirement: A Complete Developer Guide

Navigating the Journey: Becoming a Mobile App Developer

Understanding the Landscape:

Learning the Fundamentals:

Choosing Your Platform:

Exploring Development Tools:

Mastering Mobile UI/UX Design:

Embracing Continuous Learning:

Building Your Portfolio:

Excited to share insights on Android Development Testing!

A Simple Dart Tutorial

Dart Tutorial

Table of Contents

Introduction

Prerequisites

Getting Started

Topics Covered

Dart Basics

1. Hello, Dart!

2. Variables and Data Types

3. Control Flow

4. Functions

Contributing

Happy coding!

My Flutter Journey

Build error: `No such module 'CoreImage.CIFilterBuiltins'`

`pod install` fails with xcodeproj compatibility error?

Archive error: `AppIcon did not have any applicable content`

Build error: `No available simulator runtimes for platform watchsimulator`

Build error: `activeConversation` override in iMessage extension

Build reaches `Run Script` and appears stuck