Cupertino Desktop Kit (CDK)

This project, defines Flutter widgets for Desktop, providing a macOS style aesthetic, built upon the foundation of Cupertino widgets.

The goal is to be able to develop applications for all desktop systems, including the web, filling in the gaps in the Cupertino theme.

The CDK prefix strives to be distinctive within the Flutter ecosystem, while remaining concise and suggestive of Flutter Desktop and macOS AppKit. In doing so, it captures the essence of the project.

Getting Started

The project itself is just a set of libraries that define and manage widgets. However, it includes an example of how to use them. The example can be seen on this website:

CDK toolkit web Example

CDK library documentation

CDK Example

Add the library as a dependency at pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  flutter_cupertino_desktop_kit: ">= 0.0.1 < 999.0.0"

Import the library

import 'package:flutter_cupertino_desktop_kit/cdk.dart';

Then

flutter pub get
flutter pub upgrade

Use it

return const CDKApp(
    defaultAppearance: "system", // system, light, dark
    defaultColor:
        "systemBlue", 
    child: LayoutDesktop(title: "App Desktop Title"));

Run the example as a local app:

cd example
flutter create .
flutter run

Create the project if necessary

flutter create . --template=package
rm lib/flutter_cupertino_desktop_kit.dart
rm -r test
cd example
flutter create . --platform macos # Or the platform of your choice
flutter run -d macos --enable-impeller

Libraries

cdk
cdk_app
cdk_app_sidebars
cdk_button
cdk_button_check_box
cdk_button_color
cdk_button_disclosure
cdk_button_help
cdk_button_icon
cdk_button_radio
cdk_button_select
cdk_button_sidebar
cdk_button_switch
cdk_buttons_up_down
cdk_dialog_draggable
cdk_dialog_modal
cdk_dialog_outer_shadow_painter
cdk_dialog_popover
cdk_dialog_popover_arrowed
cdk_dialog_popover_clipper
cdk_dialogs_manager
cdk_field_360
cdk_field_color_hex
cdk_field_numeric
cdk_field_numeric_slider
cdk_field_text
cdk_picker_360
cdk_picker_buttons_bar
cdk_picker_buttons_segmented
cdk_picker_check_list
cdk_picker_color
cdk_picker_color_hsv
cdk_picker_slider
cdk_picker_slider_chroma
cdk_picker_slider_gradient
cdk_picker_theme_colors
cdk_progress_bar
cdk_progress_circular
cdk_theme
cdk_theme_notifier
cdk_util_disclosure
cdk_util_shader_grid