It is a framework to develop android and ios applications in a more organized way with tabrisjs
when installing voir-native installs with the dependency of tabrisjs you can go to the documentation of tabrisjs and see the entire list of widgets, services and more.
execute command
npm i voir-native
addView function adds views to the CoordinatePage
parameter types |
---|
...Array<tabris.Action | tabris.Page> |
import addView, { CoordinatePage } from "voir-native";
import { Action, Page, contentView } from "tabris";
contentView.append(<CoordinatePage layoutData="stretch" />);
addView(<Action title="setting" />, <Page title="setting" stretch />);
parameter types |
---|
Array<IMenuItemOption> |
interface IMenuItemOption {
id: string;
text: string;
image?: string;
}
import { menuDrawer } from "voir-native";
import { drawer } from "tabris";
drawer.enabled = true;
menuDrawer([
{
text: "home",
id: "home",
image: "/images/home.png",
},
{
text: "favorite",
id: "favorite",
image: "/images/favorite.png",
},
{
text: "configure",
id: "config",
image: "/images/settings.png",
},
]);
displays as a popup element in the user interface
show popup message with duration time
method | parameter types |
---|---|
contructor | string, number |
static makeToast | string, number |
show |
import { Toast } from "voir-native";
Toast.makeText("hello");
displays a popup that represents a view
method | parameter types | return |
---|---|---|
addView | ...Widget[] | |
setButtonCancel | string | tabris.Listeners |
setButtonAccept | string | tabris.Listeners |
remove | ||
removeView | ||
removeButtons | ||
show |
import { Modal } from "voir-native";
import {TextView} from "tabris";
const modal = new Modal();
modal.addView(
<TextView text="this is my text" />
);
modal.setButtonCancel("cancel").addListener(() => {
modal.remove();
});
modal.setButtonAccept("accept").addListener(() => {
modal.remove();
});
modal.show();
añade nuevo datos de preferencia
parameter types |
---|
string |
any |
recupera el valor de preferencia
parameter types | return |
---|---|
string | any |
comprueba si existe la preferencia
parameter types | return |
---|---|
string | boolean |
to add preferences where data can be saved in which the user preference persists
properties received by default to:
- ListPreference
- SwitchPreference
- CheckBoxPreference
property | type |
---|---|
title | string |
summary | string |
key | string |
value | string | boolean | number |
onSelect | (event: any)=> any |
create preference page
create a modal displaying a view of options to select
received aditional property
property | type |
---|---|
entries | IEntry[] |
interface IPropertyListPreference extends IPropertyChildPreference {
entries: IEntry[];
}
interface IEntry {
text: string;
id: string;
}
property | type |
---|---|
title | string |
summary | string |
onSelect | (event: any)=> any |
import {
PreferenceScreen,
TextPreference,
SwitchPreference,
CheckBoxPreference,
ListPreference,
} from "voir-native";
import { contentView } from "tabris";
contentView.append(
PreferenceScreen({
layoutData: "stretch",
}).append(
TextPreference({
title: "text info",
summary: "summary",
}),
SwitchPreference({
title: "title",
summary: "summary",
key: "keySwitch",
value: true,
}),
CheckBoxPreference({
title: "title",
summary: "summary",
key: "cbPreference",
value: false,
}),
ListPreference({
title: "my list preference",
key: "list",
value: 0, // default value select
entries: [{ id: "myId", text: "item 1" }],
})
)
);
handles the elements of a current page
import { CoordinatePage } from "voir-native";
import { contentView } from "tabris";
contentView.append(
CoordinatePage({
layoutData: "stretch",
drawerActionVisible: true,
})
);
// or
contentView.append(<CoordinatePage layoutData="stretch" />);
new features will be added little by little