Demo project: https://github.com/KinesteX/KinesteX-SDK-Flutter

KinesteX AI #

INTEGRATE AI FITNESS & PHYSIO TRAINER IN YOUR APP IN MINUTES #

Available Integration Options #

Integration Options #

Configuration #

Permissions #

AndroidManifest.xml

Add the following permissions for camera and microphone usage:

<!-- Add this line inside the <manifest> tag -->
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.VIDEO_CAPTURE" />

Info.plist

Add the following keys for camera and microphone usage:

<key>NSCameraUsageDescription</key>
<string>Camera access is required for video streaming.</string>
<key>NSMicrophoneUsageDescription</key>
<string>Microphone access is required for video streaming.</string>

Install libraries #

Add the following dependency to your pubspec.yaml:

dependencies:
  kinestex_sdk_flutter: ^@latest

Usage #

Initial Setup #

1. Prerequisites: Ensure you’ve added the necessary permissions in AndroidManifest.xml and Info.plist.

2. Launching the View: Initialize essential widgets, check, and request for camera permission before launching KinesteX.

void _checkCameraPermission() async {
  if (await Permission.camera.request() != PermissionStatus.granted) {
    _showCameraAccessDeniedAlert();
  }
}

void _showCameraAccessDeniedAlert() {
  showDialog(
    context: context, 
    builder: (BuildContext context) {
      return AlertDialog(
        title: const Text("Camera Permission Denied"),
        content: const Text("Camera access is required for this app to function properly."),
        actions: <Widget>[
          TextButton(
            child: const Text("OK"),
            onPressed: () {
              Navigator.of(context).pop(); 
            },
          ),
        ],
      );
    },
  );
}

Integration Options #

Available Categories to Sort Plans #

Example Integration #

1. Create a reference to KinesteXAIFramework component:

ValueNotifier<bool> showKinesteX = ValueNotifier<bool>(false);
ValueNotifier<int> reps = ValueNotifier<int>(0);
ValueNotifier<String> mistake = ValueNotifier<String>("--");
ValueNotifier<String?> updateExercise = ValueNotifier<String?>(null);

void handleWebViewMessage(WebViewMessage message) {
  switch (message.type) {
    case 'exit_kinestex':
      // hide KinesteX view
      showKinesteX.value = false;
      break;
    // Handle all other cases as needed
    default:
      log('Other message: ${message.data}');
  }
}

2. Display KinesteX with Main Integration Option:

KinesteXAIFramework.createMainView(
  apiKey: 'YOUR API KEY',
  companyName: 'YOUR COMPANY',
  userId: 'YOUR USER ID',
  planCategory: PlanCategory.Cardio, // pass the plan category
  isShowKinesTex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  onMessageReceived: handleWebViewMessage,
);

Examples for Each Integration Option #

Individual Plan

KinesteXAIFramework.createPlanView(
  apiKey: 'YOUR API KEY',
  companyName: 'YOUR COMPANY',
  userId: 'YOUR USER ID',
  planName: 'Circuit Training', // pass the name of the plan
  isShowKinesTex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  onMessageReceived: handleWebViewMessage,
);

Individual Workout

KinesteXAIFramework.createWorkoutView(
  apiKey: 'YOUR API KEY',
  companyName: 'YOUR COMPANY',
  userId: 'YOUR USER ID',
  workoutName: 'Circuit Training', // pass the name of the workout
  isShowKinesTex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  onMessageReceived: handleWebViewMessage,
);

Challenge Component

1. Change postData:

const postData = {
  'key': apiKey,
  'userId': 'YOUR USER ID',
  'company': 'YOUR COMPANY NAME',
  'exercise': 'Squats',
  'countdown': 100,
};

2. Change integration option in KinesteXSDK:

KinesteXAIFramework.createChallengeView(
  apiKey: 'YOUR API KEY',
  companyName: 'YOUR COMPANY',
  userId: 'YOUR USER ID',
  exercise: 'Squats', // pass the name of the challenge exercise
  countdown: 100, // duration of the challenge in seconds
  isShowKinesTex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  onMessageReceived: handleWebViewMessage,
);

Camera Component

1. Change postData:

const postData = {
  'key': apiKey,
  'userId': 'YOUR USER ID',
  'company': 'YOUR COMPANY NAME',
  'currentExercise': 'Squats',
  'exercises': ['Squats', 'Jumping Jack'],
};

2. Changing current exercise:

void changeExercise() {
  updateExercise.value = 'Jumping Jack';
}

3. Displaying KinesteXSDK:

KinesteXAIFramework.createCameraComponent(
  apiKey: 'YOUR API KEY',
  companyName: 'YOUR COMPANY',
  userId: 'YOUR USER ID',
  exercises: ['Squats', 'Jumping Jack'],
  currentExercise: 'Squats',
  isShowKinesTex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  onMessageReceived: handleWebViewMessage,
  updatedExercise: updateExercise.value,
);

4. Handle message for reps and mistakes a person has done:

void handleWebViewMessage(WebViewMessage message) {
  switch (message.type) {
    case 'reps':
      reps.value = message.data['value'] ?? 0;
      break;
    case 'mistake':
      mistake.value = message.data['value'] ?? '--';
      break;
    default:
      log('Other message: ${message.data}');
  }
}

Data Points #

The KinesteX SDK provides various data points that are returned through the message callback. Here are the available data types:

Contact #

If you have any questions, contact: support@kinestex.com