# Complete Example

Here's a comprehensive example combining multiple parameter categories:

**Complete Configuration Example**

_Swift (iOS)_
```swift
// Complete configuration example
let kinestex = KinesteXAIKit(
    apiKey: "YOUR_API_KEY",
    companyName: "MyFitnessApp",
    userId: "user_12345"
)

let user = UserDetails(
    age: 28,
    height: 165,
    weight: 60,
    gender: .Female,
    lifestyle: .Active
)

// Theme & Loading via IStyle class (hex values with #)
let customStyle = IStyle(
    style: "dark",
    loadingBackgroundColor: "#1A1A2E",
    loadingStickmanColor: "#00FF88",
    loadingTextColor: "#FFFFFF"
)

kinestex.createWorkoutView(
    workout: "Fitness Lite",
    user: user,
    style: customStyle,
    isLoading: $isLoading,
    // Other customization via customParams
    customParams: [
        // Language
        "language": "es",

        // UI Controls
        "isOnboarding": false,
        "hideFeelingDialog": true,

        // Camera
        "landmarkColor": "#00FF88",
        "showSilhouette": true,
        "shouldShowCameraSelector": true,

        // Leaderboard
        "showLeaderboard": true,
        "username": "FitUser28"
    ],
    onMessageReceived: { message in
        // Handle messages
    }
)
```

_Kotlin (Android)_
```kotlin
// Complete configuration example
KinesteXSDK.initialize(
    context = this,
    apiKey = "YOUR_API_KEY",
    companyName = "MyFitnessApp",
    userId = "user_12345"
)

val userDetails = UserDetails(
    age = 28,
    height = 165,
    weight = 60,
    gender = Gender.FEMALE,
    lifestyle = Lifestyle.ACTIVE
)

KinesteXSDK.createWorkoutView(
    context = this,
    workoutName = workoutId,
    user = userDetails,
    // Theme & Loading via IStyle class (hex values without #)
    style = IStyle(
        style = "dark",
        loadingBackgroundColor = "1A1A2E",
        loadingStickmanColor = "e94560",
        loadingTextColor = "FFFFFF"
    ),
    isLoading = viewModel.isLoading,
    // Other customization via customParams
    customParams = mapOf(
        // Language
        "language" to "es",

        // UI Controls
        "isOnboarding" to false,
        "hideFeelingDialog" to true,

        // Camera
        "landmarkColor" to "#00FF88",
        "showSilhouette" to true,

        // Leaderboard
        "showLeaderboard" to true,
        "username" to "FitUser28"
    ),
    onMessageReceived = { message ->
        handleWebViewMessage(message)
    },
    permissionHandler = this
)
```

_React Native_
```jsx
// Complete configuration example
const postData: IPostData = {
  // Required
  key: 'YOUR_API_KEY',
  userId: 'user_12345',
  company: 'MyFitnessApp',

  // User Profile (direct support)
  age: 28,
  height: 165,
  weight: 60,
  gender: 'Female',
  lifestyle: Lifestyle.Active,

  // Theme (direct support)
  style: {
    style: 'dark',
    loadingBackgroundColor: '1A1A2E',
    loadingTextColor: 'FFFFFF',
  },

  // Additional parameters via customParameters
  customParameters: {
    // Language
    language: 'es',

    // UI Controls
    isOnboarding: false,
    hideFeelingDialog: true,

    // Camera
    landmarkColor: '#00FF88',
    showSilhouette: true,
    shouldShowCameraSelector: true,

    // Leaderboard
    showLeaderboard: true,
    username: 'FitUser28',
  },
};
```

_Flutter_
```dart
// Complete configuration example
await KinesteXAIFramework.initialize(
  apiKey: "YOUR_API_KEY",
  companyName: "MyFitnessApp",
  userId: "user_12345",
);

final userDetails = UserDetails(
  age: 28,
  height: 165,
  weight: 60,
  gender: Gender.female,
  lifestyle: Lifestyle.active,
);

KinesteXAIFramework.createWorkoutView(
  workoutName: "Fitness Lite",
  user: userDetails,
  isShowKinestex: showKinesteX,
  isLoading: ValueNotifier<bool>(false),
  // Theme & Loading via IStyle class
  style: IStyle(
    style: 'dark',
    loadingBackgroundColor: '1A1A2E', // hex without #
    loadingStickmanColor: 'e94560',
    loadingTextColor: 'FFFFFF',
  ),
  // Other customization via customParams
  customParams: {
    // Language
    "language": "es",

    // UI Controls
    "isOnboarding": false,
    "hideFeelingDialog": true,

    // Camera
    "landmarkColor": "#00FF88",
    "showSilhouette": true,

    // Leaderboard
    "showLeaderboard": true,
    "username": "FitUser28",
  },
  onMessageReceived: (message) {
    handleWebViewMessage(message);
  },
);
```

_HTML / JavaScript_
```html
// Complete configuration example
// All parameters passed as flat object
const postData = {
  // Required
  userId: "user_12345",
  company: "MyFitnessApp",
  key: "YOUR_API_KEY",

  // User Profile
  age: 28,
  height: 165,
  weight: 60,
  gender: "Female",

  // Theme
  style: "dark",

  // Language
  language: "es",

  // UI Controls
  isOnboarding: false,
  hideFeelingDialog: true,

  // Camera
  landmarkColor: "#00FF88",
  showSilhouette: true,
  shouldShowCameraSelector: true,

  // Leaderboard
  showLeaderboard: true,
  username: "FitUser28",

  // Loading
  loadingBackgroundColor: "#1A1A2E",
  loadingTextColor: "#FFFFFF",
};

// Send to iframe
webView.contentWindow.postMessage(postData, srcURL);
```

_React (TypeScript)_
```tsx
// Complete configuration example
const postData: IPostData = {
  // Required
  key: 'YOUR_API_KEY',
  userId: 'user_12345',
  company: 'MyFitnessApp',

  // User Profile (direct support)
  age: 28,
  height: 165,
  weight: 60,
  gender: 'Female',
  lifestyle: Lifestyle.Active,

  // Theme (direct support)
  style: {
    style: 'dark',
    loadingBackgroundColor: '1A1A2E',
    loadingTextColor: 'FFFFFF',
  },

  // Additional parameters via customParameters
  customParameters: {
    // Language
    language: 'es',

    // UI Controls
    isOnboarding: false,
    hideFeelingDialog: true,

    // Camera
    landmarkColor: '#00FF88',
    showSilhouette: true,
    shouldShowCameraSelector: true,

    // Leaderboard
    showLeaderboard: true,
    username: 'FitUser28',
  },
};
```

---
Source: https://kinestex.com/docs/customization-parameters/complete-example · Index: https://kinestex.com/llms.txt