Изменение ориентации на «горизонтальное» не меняет направление прокрутки RadListView? - PullRequest
0 голосов
/ 09 апреля 2019

Я взял пример машинной детализации для углового NativeScript и пытаюсь сделать так, чтобы список машин прокручивался горизонтально, а не вертикально.Я удалил большую часть заданного html и просто собираюсь создать горизонтальный список прокрутки с оставшимся html.

Я думаю, что проблема может быть в RadListView, но я не знаю, как с этим бороться.До сих пор я пробовал ориентацию = "горизонтальный" везде, а также менял некоторые типы макетов.Я также попробовал Ориентация = "вертикальная" в RadListView, так как источник NativeScipt сказал, что это сработает ... Я очень плохо знаком с Nativescript, поэтому я надеюсь, что это легко исправить, так как я ничего не нашелэто помогло бы.

Вот HTML-часть моего проекта.Все это заключено в StackLayout с горизонтальной ориентацией.дайте мне знать, если вы хотели бы видеть что-то еще:

<RadListView orientation="horizontal" [items]="cars" (itemTap)="onCarItemTap($event)" >

    <ng-template tkListItemTemplate let-car="item" >

            <StackLayout orientation="horizontal">

                    <GridLayout rows="*, *, *" columns="*, *"  backgroundColor="purple">
                        <Label [text]="car.name" class="text-primary font-weight-bold"></Label>

                        <Image row="2" [src]="car.imageUrl" stretch="aspectFill" height="120" class="m-r-20"></Image>
                    </GridLayout>

            </StackLayout>

    </ng-template>

</RadListView>

<ActivityIndicator [busy]="Loading"></ActivityIndicator>

В настоящее время, даже со всеми горизонтали везде, я получаю вертикальный список, где каждый элементэто название автомобиля и фотография автомобиля.Но я хочу, чтобы каждый следующий элемент располагался вправо, а не внизу.

1 Ответ

1 голос
/ 09 апреля 2019

Вы должны использовать ListViewLinearLayout и установить для scrollDirection значение Horizontal.

<RadListView orientation="horizontal" [items]="cars" (itemTap)="onCarItemTap($event)" >

    <ListViewLinearLayout tkListViewLayout scrollDirection="Horizontal"></ListViewLinearLayout>

    <ng-template tkListItemTemplate let-car="item" >

            <StackLayout orientation="horizontal">

                    <GridLayout rows="*, *, *" columns="*, *"  backgroundColor="purple">
                        <Label [text]="car.name" class="text-primary font-weight-bold"></Label>

                        <Image row="2" [src]="car.imageUrl" stretch="aspectFill" height="120" class="m-r-20"></Image>
                    </GridLayout>

            </StackLayout>

    </ng-template>

</RadListView>

<ActivityIndicator [busy]="Loading"></ActivityIndicator>
...