Форум программистов, компьютерный форум, киберфорум
Наши страницы
C++ Qt
Войти
Регистрация
Восстановить пароль
 
BlinCT
1 / 1 / 3
Регистрация: 01.11.2010
Сообщений: 162
#1

Дерганая анимация в StackView QML - C++ Qt

14.07.2018, 11:10. Просмотров 99. Ответов 4
Метки нет (Все метки)

Всем привет.
У меня странная анимация при открытии в StackView когда я хочу открыть следующий слайд.
Я сделал видео в пару секунд и расшарил в своем дропбоксе, я думаю оно даст понять что именно происходит.
https://www.dropbox.com/s/24kmgvmg9q...42-54.mkv?dl=0
Кто в этом понимает подскажиет какую именно часть кода надо скинуть в чем может оказатся проблема?
Буду очень признателен за совет.

Добавлено через 13 часов 17 минут
Вообще вот все элементы что тут задействованны

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
Drawer
{
    id: rootDrawer
    property Component menuContent1: MenuContent1 { }
    property Component menuContent2: MenuContent2 { }
 
    property var componentMap: {
        "General": menuContent1,
        "Sound": menuContent2,
//        "Notice": menuContent3
    }
 
    StackView {
        id: stackView
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
 
        initialItem: ListView {
            model: ListModel {
                ListElement { title: "General" }
                ListElement { title: "Sound" }
                ListElement { title: "Notice" }
            }
 
            delegate: Button {
                width: stackView.width
                height: rootDrawer.height * 0.10
                text: title
 
                background: ButtonStyleCustom {
                    fontColor: rootDrawer.darkFontColor
                    rightAlignedIconSource: "Images/icon-go.png"
                }
 
                onClicked: {
                    if (stackView.depth == 1)
                    {
                        stackView.push(componentMap[title]);
                        stackView.currentItem.forceActiveFocus();
                    }
                }
            }
        }
    }
}
Первый элеент из пункта
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
Item {
    id: root
 
    ColumnLayout
    {
        spacing: 4
        anchors.top: parent.top
        anchors.left:parent.left
        anchors.right: parent.right
 
        ControlViewToolbar {
            Layout.fillWidth: true
        }
 
 
        RadioButtonGroup {
            id: radioButtons
            Layout.fillWidth: true
        }
 
        LanguageItem {
            id: languageItem
 
            Layout.fillWidth: true
            height: 70
        }
 
        SystemTrayCheckBox {
            id: sytemTray
            Layout.fillWidth: true
            height: 70
        }
    }
}
Если важно то сама кнопка на тулбаре для возврата
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
BlackButtonBackground {
    height: rootDrawer.height * 0.10
 
    Button {
        id: back
        width: parent.height
        height: parent.height
        anchors.left: parent.left
        anchors.bottom: parent.bottom
 
        Image {
            anchors.centerIn: parent
 
            source: "Images/icon-back.png"
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
        }
 
        onClicked: stackView.pop()
    }
 
    Text {
        id: text
        font.pixelSize: parent.height * 0.25
    }
}
А так выглядит кастомная часть каждого из пунктов, то чем заполняется стек
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
Rectangle
{
    id: root
    property color fontColor
    property url rightAlignedIconSource
 
    Text {
        id: textSingleton
    }
 
    ButtonBackground {
        anchors.fill: parent
    }
 
    implicitWidth: row.implicitWidth
    implicitHeight: row.implicitHeight
    baselineOffset: row.y + text.y + text.baselineOffset
 
    Row {
        id: row
        anchors.fill: parent
        anchors.leftMargin: textSingleton.implicitHeight
        anchors.verticalCenter: parent.verticalCenter
        anchors.horizontalCenter: parent.horizontalCenter
 
        Image {
            width: Math.min(sourceSize.width, height)
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
        }
        Text {
            id: text
            font.pixelSize: root.height * 0.25
            font.family: openSans.name
            horizontalAlignment: Text.AlignLeft
            verticalAlignment: Text.AlignVCenter
            anchors.verticalCenter: parent.verticalCenter
        }
    }
 
    Loader {
        active: rightAlignedIconSource.toString().length !== 0
        anchors.verticalCenter: parent.verticalCenter
        anchors.right: parent.right
        anchors.rightMargin: textSingleton.implicitHeight
 
        sourceComponent: Image {
            width: Math.min(sourceSize.width, height)
            height: text.implicitHeight
            fillMode: Image.PreserveAspectFit
            source: rightAlignedIconSource
        }
    }
}
Вопрос так и остается нерешенным, почему так странно раскрывается и сворачивается стек...
0
Лучшие ответы (1)
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
14.07.2018, 11:10
Я подобрал для вас темы с готовыми решениями и ответами на вопрос Дерганая анимация в StackView QML (C++ Qt):

Пушить в StackView по нажатию кнопки QML
Привет! Не могу сообразить как организовать запушивание в StackView каждый раз...

Дополнительные окна и анимация в Qml
Проблема такая, есть нарисованный график, нарисованный в прямоугольнике, я...

Анимация движения по кругу (qml)
Как сделать движение по кругу без использования канвы?

Подсветка QML элементов QML-ного плагина в QtCreator в случае нахождения QML файлов плагина в ресурсах!
Здравствуйте! Если сделать плагин для QML и подключить его в основном проекте...

TextEdit не получает фокус внутри StackView
Привет! Внутри StackView есть компонент внутри которого есть TextEdit с...

Передача данных через stackView.push
Как правильно передать объект при stackView.push()... onClicked:...

4
Mikhail1990
26 / 25 / 6
Регистрация: 22.03.2014
Сообщений: 268
14.07.2018, 12:35 #2
Надо поменять easingType на открытие - закрытие навигационной панели в stackView.
C++ (Qt)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        pushExit: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
        popEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        popExit: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
Если это то что я увидел. А там хз анимация как анимация.
0
BlinCT
1 / 1 / 3
Регистрация: 01.11.2010
Сообщений: 162
14.07.2018, 14:22  [ТС] #3
А вы не заметили разве что при открытии там как то часть элементов не плавно уходит а как то исчезает чтоли?
То есть я сравнимал в подобным и там работает хорошо, а у меня это как то не так работает.

И по поводу easingType это где надо поменять? Я чет ничего такого у себя найти не могу.
0
Mikhail1990
26 / 25 / 6
Регистрация: 22.03.2014
Сообщений: 268
14.07.2018, 16:17 #4
Лучший ответ Сообщение было отмечено BlinCT как решение

Решение

BlinCT, это находится в StackView на сигнал пуш/поп надо добавить переход Transition.
C
1
2
3
4
5
6
7
8
9
10
11
StackView{
pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
      }
}
Перемотай на Transition

Добавлено через 3 минуты
Цитата Сообщение от BlinCT Посмотреть сообщение
А вы не заметили разве что при открытии там как то часть элементов не плавно уходит а как то исчезает чтоли?
То есть я сравнимал в подобным и там работает хорошо, а у меня это как то не так работает.
По возможности используй Item вместо Rectangle. Тогда исчезнут непонятные артефакты.

Добавлено через 26 минут
BlinCT, Скопируй и вставь это в свой StackView

C++ (Qt)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
property int animationDurationStackView: 200
        pushEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        pushExit: Transition {
            PropertyAnimation {
                property: "opacity"
                easing.type: Easing.Linear
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
        popEnter: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 0
                to: 1
                duration: animationDurationStackView
            }
        }
        popExit: Transition {
            PropertyAnimation {
                property: "opacity"
                from: 1
                to: 0
                duration: animationDurationStackView
            }
        }
1
BlinCT
1 / 1 / 3
Регистрация: 01.11.2010
Сообщений: 162
14.07.2018, 16:24  [ТС] #5
Интереснео изменение в работе)
Не совсем то чт оя планировал и хотел но это тоже адекватное изменение.
Спасибо.
0
14.07.2018, 16:24
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
14.07.2018, 16:24
Привет! Вот еще темы с решениями:

QMl/QT при нажатии на кнопку должен окрыться другой qml файл
Додал anchors Вот что я сделал: import QtQuick 2.5 import QtQuick.Controls...

Как подключить QML-файл в C++ по моде, а также получить ссылки на QML-элементы в C++
Читал в интернете, как подключать QML-файлы. Кто-то использует QQmlView, кто-то...

qml - что из себя представляет qml
Решил написать игру на Qt,выбор остановился на танчиках.Посмотрел примеры и...

QML вызов другого qml
Всем привет. Название темы немного неверное. Вообщем проблема такая. Делаю игру...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru