| /**************************************************************************** |
| ** |
| ** Copyright (C) 2017 The Qt Company Ltd. |
| ** Contact: https://www.qt.io/licensing/ |
| ** |
| ** This file is part of the documentation of the Qt Toolkit. |
| ** |
| ** $QT_BEGIN_LICENSE:FDL$ |
| ** Commercial License Usage |
| ** Licensees holding valid commercial Qt licenses may use this file in |
| ** accordance with the commercial license agreement provided with the |
| ** Software or, alternatively, in accordance with the terms contained in |
| ** a written agreement between you and The Qt Company. For licensing terms |
| ** and conditions see https://www.qt.io/terms-conditions. For further |
| ** information use the contact form at https://www.qt.io/contact-us. |
| ** |
| ** GNU Free Documentation License Usage |
| ** Alternatively, this file may be used under the terms of the GNU Free |
| ** Documentation License version 1.3 as published by the Free Software |
| ** Foundation and appearing in the file included in the packaging of |
| ** this file. Please review the following information to ensure |
| ** the GNU Free Documentation License version 1.3 requirements |
| ** will be met: https://www.gnu.org/licenses/fdl-1.3.html. |
| ** $QT_END_LICENSE$ |
| ** |
| ****************************************************************************/ |
| |
| /*! |
| \example sidepanel |
| \keyword Qt Quick Controls - Side Panel |
| \title Qt Quick Controls - Side Panel |
| \keyword Qt Quick Controls 2 - Side Panel |
| \ingroup qtquickcontrols2-examples |
| \brief A persistent side panel with Drawer. |
| |
| This example demonstrates how \l Drawer can be used as a persistent side |
| panel. |
| |
| \raw HTML |
| <div class="table"><table style="background:transparent; border:0px"> |
| <tr><td style="border:0px"> |
| \endraw |
| \image qtquickcontrols2-sidepanel-portrait.png |
| \caption An interactive Drawer in portrait mode |
| \raw HTML |
| </td><td style="border:0px"> |
| \endraw |
| \image qtquickcontrols2-sidepanel-landscape.png |
| \caption A non-interactive Drawer in landscape mode |
| \raw HTML |
| </td></tr> |
| </table></div> |
| \endraw |
| |
| When the application is in portrait mode, the drawer is an interactive |
| side panel that can be swiped open from the left edge. It appears on |
| top of the content, blocking user interaction through its modal |
| background. When the application is in landscape mode, the drawer and |
| the content are laid out side-by-side. |
| |
| The current orientation of the application is determined by comparing |
| the width and height of the window: |
| |
| \snippet sidepanel/sidepanel.qml orientation |
| |
| This is used to determine whether the drawer should be \l {Popup::}{modal} |
| and \l {Drawer::}{interactive}, and to configure its \l {Drawer::}{position} |
| and \l {Popup::visible}{visibility} accordingly. |
| |
| \quotefromfile sidepanel/sidepanel.qml |
| \skipto Drawer |
| \printline Drawer |
| \dots 8 |
| \codeline |
| \skipto modal |
| \printuntil visible |
| \dots 8 |
| \skipuntil ScrollIndicator |
| \skipuntil } |
| \printline } |
| |
| \include examples-run.qdocinc |
| */ |