QML SwipeView покрывает все окно

У меня возникают проблемы, если я использую режим смахивания и написал следующий код:

import QtQuick 2.6
import QtQuick.Window 2.2
import QtQuick.Controls 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Swipe View")

    MainForm {
        anchors.fill:parent

        Rectangle{
            id:rightRect
            anchors.right:parent.right
            width: parent.width*0.50
            height:parent.height
            color:"yellow"
        }

        Rectangle{
            id:leftRect
            width:parent.width*0.50
            height:parent.height
            color:"lightgreen"
            border.color:"red"
            anchors.right:rightRect.left
            SwipeView{
                id:swipeView
                anchors.fill : leftRect
                //Layout.fillWidth: true
                currentIndex: 0
                interactive: false
                Page{
                    id:page1

                    Rectangle{
                        width:parent.width
                        height:parent.height
                        color:"lightgreen"
                        Button{
                            text:"move to 2"
                            onClicked: swipeView.currentIndex = 1
                        }
                    }
                }

                Page{
                    id:page2
                    Rectangle{
                        width:parent.width
                        height:parent.height
                        color:"lightblue"
                        Button{
                            text:"move to 1"
                            onClicked: swipeView.currentIndex = 0
                        }
                    }
                }
            }
        }
    }
}

Ниже приведены скриншоты:

1) Изначально я установил текущий индекс на «0», но видна синяя область индекса «1», которая покрывает правую область (желтый прямоугольник):

введите здесь описание изображения

2) если я нажму кнопку перейти к 2, желтый прямоугольник будет виден должным образом.

введите здесь описание изображения

Теперь, даже если я нажму перейти к 1 кнопке, мне нужно такое же поведение, т.е. желтый прямоугольник должен быть виден все время. Как этого добиться?


person pra7    schedule 26.07.2017    source источник


Ответы (1)


Добавьте clip:true к родительскому элементу SwipeView, и все будет хорошо.

Rectangle{
            id:leftRect
            width:parent.width*0.50
            height:parent.height
            color:"lightgreen"
            border.color:"red"
            anchors.right:rightRect.left
            clip:true    //add this
            SwipeView{

Согласно документации Qt

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

По умолчанию это значение ложно, поэтому ваш SwipeView выходит за пределы прямоугольной области.

person Abhishek Agarwal    schedule 26.07.2017
comment
Если я добавляю клип, он работает должным образом, но есть ли способ отключить переход при изменении индекса ?? - person pra7; 26.07.2017
comment
К какому индексу вы имеете в виду? - person Abhishek Agarwal; 26.07.2017
comment
SwipeView - ›когда я устанавливаю этот swipeView.currentIndex, происходит некоторый переход / анимация. - person pra7; 26.07.2017
comment
Я считаю, что ваша проблема указана на форуме Qt: forum.qt. io / topic / 81535 / swipeview-page-change-without-animation К сожалению, это невозможно сделать, используя только SwipeView, как указано в приведенной выше ссылке. - person Abhishek Agarwal; 27.07.2017
comment
Спасибо, и я уже ссылался на ссылку выше, Надеюсь, что в следующей версии появится возможность. - person pra7; 27.07.2017
comment
@ pra7 Взгляните на StackLayout, который выполняет то же самое, что и SwipeView, но без анимации при изменении currentIndex. - person Blabdouze; 27.07.2017
comment
@Blabdouze .. Спасибо за предложение, попробую StackLayout. - person pra7; 27.07.2017