GridLayout в NativeScript не отображается должным образом - PullRequest
0 голосов
/ 09 июня 2019

Моя проблема

Я пытаюсь создать этот экран в NativeScript:

Settings

Я использую GridLayout, как все рекомендовали. Я следовал за документами к письму (я думаю), и это мой результат:

My Outcome

Как видите, даже не близко. Вот мой XML:

<Page
    navigatingTo="onNavigatingTo"  
    xmlns="http://schemas.nativescript.org/tns.xsd">

    <ActionBar class="action-bar customActionBar">
        <!-- 
        Use the NavigationButton as a side-drawer button in Android
        because ActionItems are shown on the right side of the ActionBar
        -->
        <NavigationButton ios:visibility="collapsed" icon="res://menu" tap="onDrawerButtonTap"></NavigationButton>
        <!-- 
        Use the ActionItem for IOS with position set to left. Using the
        NavigationButton as a side-drawer button in iOS is not possible,
        because its function is to always navigate back in the application.
        -->
        <ActionItem icon="res://navigation/menu" 
            android:visibility="collapsed" 
            tap="onDrawerButtonTap"
            ios.position="left">
        </ActionItem>
        <Label class="action-bar-title" text="Settings"></Label>
    </ActionBar>

    <GridLayout columns="2*, auto, auto" rows="75, auto, auto" width="100%" height="100%" backgroundColor="lightgray" >
    <Label text="Notifications" row="0" col="0"/>
    <Label text="Push" row="0" col="1" />
    <Label text="Email" row="0" col="2" />
<Label text="Messages" row="1" col="0"/>
<Switch checked="true" (checkedChange)="onCheckedChange($event)" class="m-15" row="1" col="1"></Switch>
 <Switch checked="true" (checkedChange)="onCheckedChange($event)" class="m-15" row="1" col="2"></Switch>
  </GridLayout>
</Page>


Я попытался поиграть с числами, и они все равно не будут отображаться так, как мне нужно.

Я делаю что-то не так. Вы можете мне помочь?

Спасибо.

John

1 Ответ

1 голос
/ 10 июня 2019

Смотрите, если что-то вроде

columns="4*, *, *"

дает то, что вы хотите.Затем вы можете увидеть css, чтобы добавить отступы и центрирование к столбцам.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...