Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit c381972

Browse files
Merge remote-tracking branch 'origin/main' into feat/security-overview
2 parents 3fa7d53 + 43ee151 commit c381972

File tree

1 file changed

+15
-5
lines changed

1 file changed

+15
-5
lines changed

‎content/guide/create-custom-native-elements.md

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -240,8 +240,14 @@ Let's create a `<Checkbox>` component that behaves consistently on iOS and Andro
240240

241241
<iframe style="width: 100%; min-height: 200px; aspect-ratio: 16 / 9;" src="https://www.youtube.com/embed/08uip43irOM" title="Creating custom elements with NativeScript" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
242242

243-
See the full working example on StackBlitz: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox?file=src%2Fapp%2Fcheckbox%2Fcommon.ts
244-
243+
See the full working example on StackBlitz:
244+
- Angular: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox?file=src%2Fapp%2Fcheckbox%2Fcommon.ts
245+
- React: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-react?file=src%2Fcomponents%2FScreenOne.tsx
246+
- Solid: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-solid?file=src%2Fcomponents%2Fhome.tsx
247+
- Svelte: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-svelte?file=app%2Fcomponents%2FHome.svelte
248+
- TypeScript: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-ts?file=app%2Fmain-page.xml
249+
- Vue: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-vue?file=src%2Fcomponents%2FHome.vue
250+
245251
In NativeScript, creating custom UI components can be straightforward and powerful. In this guide, you'll learn how to build a simple, reusable Checkbox component using only built-in modules from `@nativescript/core`. We'll leverage a combination of `GridLayout`, `Label`, and Material Design icons.
246252

247253
### Step-by-Step Guide
@@ -421,10 +427,14 @@ selectionColorProperty.register(CheckboxCommon)
421427

422428
### Complete Example and Testing
423429

424-
Explore and interact with the complete example directly:
430+
Explore and interact with the complete example directly in the flavor you love:
425431

426-
- **Full Implementation:** [Common Checkbox Component](https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox?file=src%2Fapp%2Fcheckbox%2Fcommon.ts)
427-
- **Element Registration:** [Checkbox Registration](https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox?file=src%2Fapp%2Fapp.component.ts%3AL5)
432+
- Angular: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox?file=src%2Fapp%2Fcheckbox%2Fcommon.ts
433+
- React: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-react?file=src%2Fcomponents%2FScreenOne.tsx
434+
- Solid: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-solid?file=src%2Fcomponents%2Fhome.tsx
435+
- Svelte: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-svelte?file=app%2Fcomponents%2FHome.svelte
436+
- TypeScript: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-ts?file=app%2Fmain-page.xml
437+
- Vue: https://stackblitz.com/edit/nativescript-create-custom-elements-checkbox-vue?file=src%2Fcomponents%2FHome.vue
428438

429439
---
430440

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /