Javascript Girl
  1. Javascript Girl
  3. Comment créer un TabView avec l'icône et le titre comme l'image que j'ai attachée ci-dessous en utilisant NativeScript?
Intereting Posts
Comment puis-je réduire les ralentissements de l'événement mousemove? Comment créer des éléments xhtml avec javascript URL actuelle dans Safari Extension Événement lorsque la vidéo de Youtube a fini Paypal Express Checkout Security avec Cilent Ajax Call Existe-t-il un moyen de faire fonctionner Chai avec des tests de Mocha asynchrones? Mise en route: Configuration de la base de données pour Node.js Pourquoi cette erreur est-elle "invalide appelant"? Javascript, vérifiez si le nœud enfant est un élément ou un nœud de texte Comment désélectionner le record de la grille dans kendoui Comment puis-je recharger automatiquement une extension Chrome que je développe? Comment supprimer $ (document). Sur un événement de clic? Type d'entrée FILE multiple – ajouter des fichiers séquentiellement Requête MongoDB sur les champs peuplés Autoriser uniquement certains caractères

Comment créer un TabView avec l'icône et le titre comme l'image que j'ai attachée ci-dessous en utilisant NativeScript?

Entrez la description de l'image ici

Toute aide serait appréciée. Merci

Pour créer une icône TabView avec NativeScript, vous devez configurer la propriété TabViewItem iconSource . Vous devez définir le chemin d'image ou le nom de l'image si vous les chargez à partir des Ressources. La partie importante pour iOS consiste à configurer la iosIconRenderingMode="alwaysOriginal" , ce qui permettra de montrer correctement l'image dans l'onglet 

 <Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page"> <Page.actionBar> <ActionBar title="My App" icon="" class="action-bar"> </ActionBar> </Page.actionBar> <GridLayout> <TabView id="tabViewContainer" iosIconRenderingMode="alwaysOriginal"> <TabView.items> <TabViewItem title="Tab 1" iconSource="res://icon"> <TabViewItem.view> <Label text="This is Label in Tab 1" /> </TabViewItem.view> </TabViewItem> <TabViewItem title="Tab 2" iconSource="res://icon"> <TabViewItem.view> <Label text="This is Label in Tab 2" /> </TabViewItem.view> </TabViewItem> </TabView.items> </TabView> </GridLayout> </Page>

Cet exemple est basé sur des glyphes provenant d'Ionicons mais peut être facilement adapté. 

 <TabViewItem title="title"> <TabViewItem.view> <FormattedString> <Span fontSize="40" fontFamily="ionicons" text="&#xf456;"></Span> <!--Image/Logo--> <Span fontSize="10" text="&#xA;"></Span> <!--BreakLine--> <Span fontSize="10" text="Text"></Span> <!--Text--> </FormattedString> </TabViewItem.view> </TabViewItem>