Nativescript Multi Select
Overview
Nativescript Multi Select is a popup dialog which provides multi selection, search through list and return the selected items.
Installation
tns plugin add nativescript-multi-select
Usage
TypeScript
;; ;; ; MSelect.showoptions;
Angular
;;;
Vue
API
MultiSelect
Property | Type | Description |
---|---|---|
show(options: MSOption) |
() : void |
Show Multi Select Dialog |
MSOption
Property | Type | Description |
---|---|---|
title |
string |
Dialog Title |
confirmButtonText |
string |
confirm button text optional |
cancelButtonText |
string |
cancel button text optional |
selectedItems |
Array<any> |
predefined items optional |
items |
Array<any> |
items/list that will be display |
bindValue |
string |
the value that will determine the property which will be return when an item is selected optional |
displayLabel |
string |
the value that will determine the property which will be display in the list optional |
ios |
MSiOSOption |
ios options optional |
android |
MSAndroidOption |
android options optional |
onConfirm: (selectedItems: Array<any>) => void |
Function Callback |
callback which fires when the selection has been confirm/done |
onItemSelected: (selectedItem: any) => void |
Function Callback |
callback which fires when an item has been selected optional |
onCancel: () => void |
Function Callback |
callback which fires when the cancel button is tapped optional |
MSAndroidOption (for android)
Property | Type | Description |
---|---|---|
titleSize |
number |
optional |
confirmButtonTextColor |
string |
optional |
cancelButtonTextColor |
string |
optional |
MSiOSOption (for ios)
Property | Type | Description |
---|---|---|
cancelButtonBgColor |
string |
optional |
confirmButtonBgColor |
string |
optional |
confirmButtonTextColor |
string |
optional |
cancelButtonTextColor |
string |
optional |
showType |
number |
popup view show type, default by AAPopupViewShowTypeFadeIn optional |
dismissType |
number |
popup view dismiss type, default by AAPopupViewDismissTypeFadeOut optional |
itemColor |
string |
item text color optional |
iOS Popup: Animation AShowType ENUM
Property | Value |
---|---|
TypeNone | 0 |
TypeFadeIn | 1 |
TypeGrowIn | 2 |
TypeShrinkIn | 3 |
TypeSlideInFromTop | 4 |
TypeSlideInFromBottom | 5 |
TypeSlideInFromLeft | 6 |
TypeSlideInFromRight | 7 |
TypeBounceIn | 8 |
TypeBounceInFromTop | 9 |
TypeBounceInFromBottom | 10 |
TypeBounceInFromLeft | 11 |
TypeBounceInFromRight | 12 |
iOS Popup: Animation ADismissType ENUM
Property | Value |
---|---|
TypeNone | 0 |
TypeFadeOut | 1 |
TypeGrowOut | 2 |
TypeShrinkOut | 3 |
TypeSlideOutToTop | 4 |
TypeSlideOutToBottom | 5 |
TypeSlideOutToLeft | 6 |
TypeSlideOutToRight | 7 |
TypeBounceOut | 8 |
TypeBounceOutToTop | 9 |
TypeBounceOutToBottom | 10 |
TypeBounceOutToLeft | 11 |
TypeBounceOutToRight | 12 |
Author
Jonathan Mayunga, mayunga.j@gmail.com
Credits
- For Android we're using the MultiSelectDialog by abumoallim,
- For iOS AAMultiSelectController by Alex Ao.
License
Apache License Version 2.0, January 2004