{"id":31427082,"url":"https://github.com/serverpod/cupertino_native","last_synced_at":"2025-10-12T06:56:50.119Z","repository":{"id":313075031,"uuid":"1049937534","full_name":"serverpod/cupertino_native","owner":"serverpod","description":"Native Liquid Glass widgets for iOS and macOS with pixel-perfect fidelity.","archived":false,"fork":false,"pushed_at":"2025-09-08T08:13:16.000Z","size":1302,"stargazers_count":69,"open_issues_count":4,"forks_count":12,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-02T09:12:25.587Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/serverpod.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":"AGENTS.md","dco":null,"cla":null}},"created_at":"2025-09-03T17:59:15.000Z","updated_at":"2025-10-02T08:12:28.000Z","dependencies_parsed_at":"2025-09-03T20:15:14.891Z","dependency_job_id":"cb13a97f-ca66-41b2-a4fe-4cdca01b7d77","html_url":"https://github.com/serverpod/cupertino_native","commit_stats":null,"previous_names":["serverpod/cupertino_native"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/serverpod/cupertino_native","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverpod%2Fcupertino_native","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverpod%2Fcupertino_native/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverpod%2Fcupertino_native/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverpod%2Fcupertino_native/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/serverpod","download_url":"https://codeload.github.com/serverpod/cupertino_native/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/serverpod%2Fcupertino_native/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279010546,"owners_count":26084758,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-10-12T02:00:06.719Z","response_time":53,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-09-30T06:02:30.988Z","updated_at":"2025-10-12T06:56:50.112Z","avatar_url":"https://github.com/serverpod.png","language":"Swift","funding_links":[],"categories":["Swift"],"sub_categories":[],"readme":"[![Serverpod Liquid Glass Flutter banner](https://github.com/serverpod/cupertino_native/raw/main/misc/banner.jpg)](https://serverpod.dev)\n\n_This package is part of Serverpod's open-source initiative. [Serverpod](https://serverpod.dev) is the ultimate backend for Flutter - all written in Dart, free, and open-source. 👉 [Check it out](https://serverpod.dev)_\n\n# Liquid Glass for Flutter\n\nNative Liquid Glass widgets for iOS and macOS in Flutter with pixel‑perfect fidelity.\n\nThis plugin hosts real UIKit/AppKit controls inside Flutter using Platform Views and method channels. It matches native look/feel perfectly while still fitting naturally into Flutter code.\n\nDoes it work and is it fast? Yes. Is it a vibe-coded Frankenstein's monster patched together with duct tape? Also yes.\n\nThis package is a proof of concept for bringing Liquid Glass to Flutter. Contributions are most welcome. What we have here can serve as a great starting point for building a complete, polished library. The vision for this package is to bridge the gap until we have a good, new Cupertino library written entirely in Flutter. To move toward completeness, we can also improve parts that are easy to write in Flutter to match the new Liquid Glass style (e.g., improved `CupertinoScaffold`, theme, etc.).\n\nRead the release blogpost: 👉 [Is it time for Flutter to leave the uncanny valley?](https://medium.com/serverpod/is-it-time-for-flutter-to-leave-the-uncanny-valley-b7f2cdb834ae)\n\n## Installation\n\nAdd the dependency in your app’s `pubspec.yaml`:\n\n```bash\nflutter pub add cupertino_native\n```\n\nThen run `flutter pub get`.\n\nEnsure your platform minimums are compatible:\n\n- iOS `platform :ios, '14.0'`\n- macOS 11.0+\n\nYou will also need to install the Xcode 26 beta and use `xcode-select` to set it as your default.\n\n```bash\nsudo xcode-select -s /Applications/Xcode-beta.app\n```\n\n## What's in the package\n\nThis package ships a handful of native Liquid Glass widgets. Each widget exposes a simple, Flutter‑friendly API and falls back to a reasonable Flutter implementation on non‑Apple platforms.\n\n### Slider\n\n![Liquid Glass Slider](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/slider.png)\n\n```dart\ndouble _value = 50;\n\nCNSlider(\n  value: _value,\n  min: 0,\n  max: 100,\n  onChanged: (v) =\u003e setState(() =\u003e _value = v),\n)\n```\n\n### Switch\n\n![Liquid Glass Switch](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/switch.png)\n\n```dart\nbool _on = true;\n\nCNSwitch(\n  value: _on,\n  onChanged: (v) =\u003e setState(() =\u003e _on = v),\n)\n```\n\n### Segmented Control\n\n![Liquid Glass Segmented Control](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/segmented-control.png)\n\n```dart\nint _index = 0;\n\nCNSegmentedControl(\n  labels: const ['One', 'Two', 'Three'],\n  selectedIndex: _index,\n  onValueChanged: (i) =\u003e setState(() =\u003e _index = i),\n)\n```\n\n### Button\n\n![Liquid Glass Button](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/button.png)\n\n```dart\nCNButton(\n  label: 'Press me',\n  onPressed: () {},\n)\n\n// Icon button variant\nCNButton.icon(\n  icon: const CNSymbol('heart.fill'),\n  onPressed: () {},\n)\n```\n\n### Icon (SF Symbols)\n\n![Liquid Glass Icon](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/icon.png)\n\n```dart\n// Monochrome symbol\nconst CNIcon(symbol: CNSymbol('star'));\n\n// Multicolor / hierarchical options are also supported\nconst CNIcon(\n  symbol: CNSymbol('paintpalette.fill'),\n  mode: CNSymbolRenderingMode.multicolor,\n)\n```\n\n### Popup Menu Button\n\n![Liquid Glass Popup Menu Button](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/popup-menu-button.png)\n\n```dart\nfinal items = [\n  const CNPopupMenuItem(label: 'New File', icon: CNSymbol('doc', size: 18)),\n  const CNPopupMenuItem(label: 'New Folder', icon: CNSymbol('folder', size: 18)),\n  const CNPopupMenuDivider(),\n  const CNPopupMenuItem(label: 'Rename', icon: CNSymbol('rectangle.and.pencil.and.ellipsis', size: 18)),\n];\n\nCNPopupMenuButton(\n  buttonLabel: 'Actions',\n  items: items,\n  onSelected: (index) {\n    // Handle selection\n  },\n)\n```\n\n### Tab Bar\n\n![Liquid Glass Tab Bar](https://github.com/serverpod/cupertino_native/raw/main/misc/screenshots/tab-bar.png)\n\n```dart\nint _tabIndex = 0;\n\n// Overlay this at the bottom of your page\nCNTabBar(\n  items: const [\n    CNTabBarItem(label: 'Home', icon: CNSymbol('house.fill')),\n    CNTabBarItem(label: 'Profile', icon: CNSymbol('person.crop.circle')),\n    CNTabBarItem(label: 'Settings', icon: CNSymbol('gearshape.fill')),\n  ],\n  currentIndex: _tabIndex,\n  onTap: (i) =\u003e setState(() =\u003e _tabIndex = i),\n)\n```\n\n## What's left to do?\nSo far, this is more of a proof of concept than a full package (although the included components do work). Future improvements include:\n\n- Cleaning up the code. Probably by someone who knows a bit about Swift.\n- Adding more native components.\n- Reviewing the Flutter APIs to ensure consistency and eliminate redundancies.\n- Extending the flexibility and styling options of the widgets.\n- Investigate how to best combine scroll views with the native components.\n- macOS compiles and runs, but it's untested with Liquid Glass and generally doesn't look great.\n\n## How was this done?\nPretty much vibe-coded with Codex and GPT-5. 😅\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fserverpod%2Fcupertino_native","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fserverpod%2Fcupertino_native","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fserverpod%2Fcupertino_native/lists"}