qt-chat-app

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

SettingsView.qml (5821B)

      1 import QtQuick
      2 import QtQuick.Layouts
      3 import "../components"
      4 import "../models"
      5 import "../styles"
      6 
      7 Item {
      8     id: root
      9 
     10     ColumnLayout {
     11         anchors.fill: parent
     12         spacing: 0
     13 
     14         // Top bar
     15         TopBar {
     16             Layout.fillWidth: true
     17             title: "Settings"
     18             showBackButton: true
     19             showMenuButton: false
     20             onBackClicked: {
     21                 if (typeof stackView !== 'undefined' && stackView) {
     22                     stackView.pop()
     23                 }
     24             }
     25         }
     26 
     27         // Settings content
     28         Rectangle {
     29             Layout.fillWidth: true
     30             Layout.fillHeight: true
     31             color: TelegramStyle.backgroundColor
     32 
     33             ListView {
     34                 id: settingsList
     35                 anchors.fill: parent
     36                 clip: true
     37 
     38                 model: ListModel {
     39                     ListElement {
     40                         icon: "\ud83d\udc64"
     41                         title: "Profile"
     42                         subtitle: "Set your name and photo"
     43                     }
     44                     ListElement {
     45                         icon: "\ud83d\udd14"
     46                         title: "Notifications"
     47                         subtitle: "Message and group notifications"
     48                     }
     49                     ListElement {
     50                         icon: "\ud83d\udd12"
     51                         title: "Privacy and Security"
     52                         subtitle: "Phone number, last seen, profile photo"
     53                     }
     54                     ListElement {
     55                         icon: "\ud83d\udcca"
     56                         title: "Data and Storage"
     57                         subtitle: "Network usage, auto-download"
     58                     }
     59                     ListElement {
     60                         icon: "\ud83c\udfa8"
     61                         title: "Appearance"
     62                         subtitle: "Theme, chat background, night mode"
     63                     }
     64                     ListElement {
     65                         icon: "\ud83c\udf10"
     66                         title: "Language"
     67                         subtitle: "English"
     68                     }
     69                     ListElement {
     70                         icon: "\u2753"
     71                         title: "Help"
     72                         subtitle: "FAQ and support"
     73                     }
     74                 }
     75 
     76                 delegate: Rectangle {
     77                     width: settingsList.width
     78                     height: 72
     79                     color: settingsMouseArea.containsMouse ? "#f5f5f5" : "white"
     80 
     81                     Behavior on color {
     82                         ColorAnimation { duration: 100 }
     83                     }
     84 
     85                     RowLayout {
     86                         anchors.fill: parent
     87                         anchors.margins: TelegramStyle.standardMargin
     88                         spacing: TelegramStyle.standardMargin
     89 
     90                         // Icon
     91                         Text {
     92                             Layout.preferredWidth: TelegramStyle.avatarSize
     93                             Layout.preferredHeight: TelegramStyle.avatarSize
     94                             text: model.icon
     95                             font.pixelSize: 32
     96                             horizontalAlignment: Text.AlignHCenter
     97                             verticalAlignment: Text.AlignVCenter
     98                         }
     99 
    100                         // Content
    101                         ColumnLayout {
    102                             Layout.fillWidth: true
    103                             spacing: 4
    104 
    105                             Text {
    106                                 Layout.fillWidth: true
    107                                 text: model.title
    108                                 font.pixelSize: TelegramStyle.fontSizeNormal
    109                                 font.bold: false
    110                                 color: TelegramStyle.textPrimary
    111                             }
    112 
    113                             Text {
    114                                 Layout.fillWidth: true
    115                                 text: model.subtitle
    116                                 font.pixelSize: TelegramStyle.fontSizeSmall
    117                                 color: TelegramStyle.textSecondary
    118                                 elide: Text.ElideRight
    119                             }
    120                         }
    121 
    122                         // Arrow
    123                         Text {
    124                             text: "\u203a"  // Right angle bracket
    125                             font.pixelSize: 24
    126                             color: TelegramStyle.textSecondary
    127                         }
    128                     }
    129 
    130                     MouseArea {
    131                         id: settingsMouseArea
    132                         anchors.fill: parent
    133                         hoverEnabled: true
    134                         cursorShape: Qt.PointingHandCursor
    135                         onClicked: {
    136                             if (model.title === "Profile") {
    137                                 // Navigate to profile
    138                                 if (typeof stackView !== 'undefined' && stackView) {
    139                                     stackView.push(Qt.resolvedUrl("ProfileView.qml"))
    140                                 }
    141                             } else {
    142                                 // TODO: implement other settings actions
    143                             }
    144                         }
    145                     }
    146 
    147                     // Divider
    148                     Rectangle {
    149                         anchors.bottom: parent.bottom
    150                         anchors.left: parent.left
    151                         anchors.right: parent.right
    152                         anchors.leftMargin: TelegramStyle.standardMargin + TelegramStyle.avatarSize + TelegramStyle.standardMargin
    153                         height: 1
    154                         color: TelegramStyle.divider
    155                     }
    156                 }
    157             }
    158         }
    159     }
    160 }