{"id":15141992,"url":"https://github.com/bradmartin/nativescript-wear-os","last_synced_at":"2025-09-05T04:33:34.436Z","repository":{"id":33847476,"uuid":"162762797","full_name":"bradmartin/nativescript-wear-os","owner":"bradmartin","description":"Consolidated repo for WearOS with NativeScript","archived":false,"fork":false,"pushed_at":"2023-04-30T03:53:01.000Z","size":6588,"stargazers_count":35,"open_issues_count":15,"forks_count":7,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-12-13T20:52:12.172Z","etag":null,"topics":["android","nativescript","watches","wear-os","wearable","wearable-devices"],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bradmartin.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","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}},"created_at":"2018-12-21T22:24:44.000Z","updated_at":"2024-09-19T09:43:34.000Z","dependencies_parsed_at":"2024-06-21T16:44:39.530Z","dependency_job_id":"cbd1f3ef-6b91-4f25-bc3a-fb99b7124963","html_url":"https://github.com/bradmartin/nativescript-wear-os","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bradmartin%2Fnativescript-wear-os","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bradmartin%2Fnativescript-wear-os/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bradmartin%2Fnativescript-wear-os/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bradmartin%2Fnativescript-wear-os/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bradmartin","download_url":"https://codeload.github.com/bradmartin/nativescript-wear-os/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":232024700,"owners_count":18461966,"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","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":["android","nativescript","watches","wear-os","wearable","wearable-devices"],"created_at":"2024-09-26T09:21:36.844Z","updated_at":"2024-12-31T19:51:50.472Z","avatar_url":"https://github.com/bradmartin.png","language":"TypeScript","funding_links":[],"categories":["Platforms"],"sub_categories":["Community Flavors"],"readme":"\u003ca align=\"center\" href=\"https://www.npmjs.com/package/nativescript-wear-os\"\u003e\n    \u003ch3 align=\"center\"\u003eNativeScript Wear OS\u003c/h3\u003e\n\u003c/a\u003e\n\u003ch4 align=\"center\"\u003e\nNativeScript-Wear-OS is a NativeScript plugin that provides layouts and utilities specific to WearOS.\n\u003c/h4\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/nativescript-gif\"\u003e\n        \u003cimg src=\"https://github.com/bradmartin/nativescript-wear-os/workflows/Build%20CI/badge.svg\" alt=\"Action Build\"\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/nativescript-wear-os\"\u003e\n        \u003cimg src=\"https://img.shields.io/npm/v/nativescript-wear-os.svg\" alt=\"npm\"\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/nativescript-wear-os\"\u003e\n        \u003cimg src=\"https://img.shields.io/npm/dt/nativescript-wear-os.svg?label=npm%20downloads\" alt=\"npm\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n---\n\n## Installation\n\nNativeScript Version 7+:\n\n```bash\ntns plugin add nativescript-wear-os\n```\n\nNativeScript version prior to 7:\n\n```bash\ntns plugin add nativescript-wear-os@2.1.1\n```\n\n---\n\n### Ambient Mode Support\n\n##### Documentation: _https://developer.android.com/training/wearables/apps/always-on_\n\n1. Add the `WAKE_LOCK` permission to your AndroidManifest.xml\n\n```xml\n\t\u003cuses-permission android:name=\"android.permission.WAKE_LOCK\" /\u003e\n```\n\n2. Copy the `ambient-activity.ts` in the root of this project's demo app and use it to replace the default Android Activity loaded by NativeScript. [NativeScript docs HERE about using a custom Android Activity.](https://docs.nativescript.org/core-concepts/android-runtime/advanced-topics/extend-application-activity#extending-activity)\n\n3. Update the AndroidManifest.xml for your application to use the correct activity. Change the `android:name` value of the `activity` node to point to the same name used inside the `ambient-activity.ts` file inside the `@JavaProxy()` decorator at the top of the file.\n\n```xml\n\t\t\u003cactivity android:name=\"com.nativescript.AmbientActivity\" android:label=\"@string/title_activity_kimera\" android:configChanges=\"keyboardHidden|orientation|screenSize\" android:theme=\"@style/LaunchScreenTheme\"\u003e\n```\n\n4. Update your webpack.config to include the custom Android Activity. Snippet below copied from the demo app.\n\n```javascript\n// Add your custom Activities, Services and other Android app components here.\nconst appComponents = [\n  '@nativescript/core/ui/frame',\n  '@nativescript/core/ui/frame/activity',\n  resolve(__dirname, 'app/ambient-activity'),\n];\n```\n\n---\n\n### WearOsLayout\n\nA base layout for Wear OS apps built with NativeScript that automatically handles calculating the inset for circle watch faces. To disable the layout from automatically adjusting the inset set `disableInsetConstraint=\"true\"` on the `WearOsLayout` instance. The default is false and does not have to be set.\n\nThis has no effect on square watches.\n\n```xml\n\u003cPage xmlns=\"http://schemas.nativescript.org/tns.xsd\" actionBarHidden=\"true\"\n    xmlns:ui=\"nativescript-wear-os/packages/wear-os-layout\"\u003e\n    \u003cui:WearOsLayout disableInsetConstraint=\"false\"\u003e\n      \u003cScrollView height=\"100%\"\u003e\n        \u003cStackLayout\u003e\n            \u003cLabel text=\"Going to put a long string of text so we can fill the screen with other view components to show how this works on Circle and Square watch faces.\" class=\"c-white\" textWrap=\"true\" /\u003e\n            \u003cGridLayout rows=\"auto, auto, auto\" columns=\"*, *, *\"\u003e\n                \u003cButton text=\"Go Back\" tap=\"navBack\" class=\"yellowBtn\" row=\"0\" col=\"0\" /\u003e\n                \u003cImage src=\"res://icon\" stretch=\"aspectFit\" row=\"0\" col=\"1\" /\u003e\n                \u003cButton text=\"Wow\" class=\"greenBtn\" row=\"0\" col=\"2\" /\u003e\n                \u003cButton text=\"Fantastic\" row=\"1\" col=\"0\" /\u003e\n                \u003cLabel text=\"Something something something\" class=\"c-white\" row=\"1\" col=\"1\" textWrap=\"true\" /\u003e\n                \u003cLabel text=\"Something Text\" row=\"1\" col=\"2\" /\u003e\n                \u003cButton text=\"Yay\" row=\"2\" col=\"0\" /\u003e\n                \u003cImage src=\"res://icon\" stretch=\"aspectFit\" row=\"2\" col=\"1\" /\u003e\n                \u003cButton text=\"Okay\" row=\"2\" col=\"2\" /\u003e\n            \u003c/GridLayout\u003e\n          \u003c/StackLayout\u003e\n        \u003c/ScrollView\u003e\n    \u003c/ui:WearOsLayout\u003e\n\u003c/Page\u003e\n```\n\n| Circle Watch                                                |                        Square Watch                         |\n| ----------------------------------------------------------- | :---------------------------------------------------------: |\n| ![Cirlce Watch Usage](./screenshots/base-layout/circle.png) | ![Square Watch Usage](./screenshots/base-layout/square.png) |\n\n---\n\n### WearOsListView\n\n```xml\n\u003cPage xmlns=\"http://schemas.nativescript.org/tns.xsd\"\n  xmlns:wear=\"nativescript-wear-os/packages/listview\"\u003e\n  \u003cStackLayout\u003e\n    \u003cwear:WearOsListView useScalingScroll=\"true\" height=\"100%\" items=\"{{ items }}\"\u003e\n      \u003cwear:WearOsListView.itemTemplate\u003e\n        \u003cGridLayout rows=\"*\" columns=\"auto, *\"\u003e\n          \u003cImage src=\"{{ image }}\" row=\"0\" col=\"0\" /\u003e\n          \u003cLabel text=\"{{ title }}\" row=\"0\" col=\"1\" /\u003e\n        \u003c/GridLayout\u003e\n      \u003c/wear:WearOsListView.itemTemplate\u003e\n    \u003c/wear:WearOsListView\u003e\n  \u003c/StackLayout\u003e\n\u003c/Page\u003e\n```\n\n##### API\n\n_useScalingScroll_ - If true, the items in the listview will scale during the scroll layout change event.\n\n![ListView Gif](./screenshots/listview/demo.gif)\n\n---\n\n### BoxInsetLayout\n\n```xml\n\u003cPage xmlns=\"http://schemas.nativescript.org/tns.xsd\" loaded=\"pageLoaded\" actionBarHidden=\"true\"\n    xmlns:ui=\"nativescript-wear-os/packages/box-inset-layout\"\u003e\n    \u003cui:BoxInsetLayout\u003e\n        \u003cStackLayout height=\"100%\" width=\"100%\"\u003e\n            \u003cLabel text=\"This is a box inset layout. It's purpose is for short views so you don't have to calculate the inset for your layout manually. So don't try using a ScrollView with it.\" class=\"text-white\" textWrap=\"true\"/\u003e\n            \u003cGridLayout rows=\"50\" columns=\"*, *\"\u003e\n                \u003cButton col=\"0\" text=\"Go Back\" class=\"greyBtn\" tap=\"navBack\" /\u003e\n                \u003cButton col=\"1\" text=\"Okay\" class=\"yellowBtn\" /\u003e\n            \u003c/GridLayout\u003e\n        \u003c/StackLayout\u003e\n    \u003c/ui:BoxInsetLayout\u003e\n\u003c/Page\u003e\n```\n\n![BoxInsetLayout Usage](./screenshots/box-inset/boxinset.png)\n\n### Dialogs\n\nThis plugin uses an Android WearOS specific library [SmartWearOs](https://github.com/bradmartin/SmartWearOs).\n\nThe plugin has a success dialog and failure/error dialog to present on WearOS. These mimic the behavior of the built in Confirmation Activity on WearOS. With the option of setting the time before it is dismissed/hidden from the user.\n\n#### Usage\n\n```typescript\nimport {\n  showFailure,\n  showSuccess,\n} from 'nativescript-wear-os/packages/dialogs';\n\nshowSuccess('Great choice! NativeScript is awesome.', 4).then(() =\u003e {\n  console.log('success dialog complete.');\n});\n```\n\n![Success Activity](./screenshots/success-activity.png)\n![Failure Activity](./screenshots/failure-activity.png)\n\n## [Change Log](./CHANGELOG.md)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbradmartin%2Fnativescript-wear-os","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbradmartin%2Fnativescript-wear-os","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbradmartin%2Fnativescript-wear-os/lists"}