diff --git a/Fk/Logic.js b/Fk/Logic.js index b098e7ef..aa7fc923 100644 --- a/Fk/Logic.js +++ b/Fk/Logic.js @@ -163,6 +163,7 @@ callbacks["UpdateRoomList"] = (data) => { data.forEach(room => { const [roomId, roomName, gameMode, playerNum, capacity, hasPassword, outdated] = room; + for (let j=0;j<40;j++) current.roomModel.append({ roomId, roomName, gameMode, playerNum, capacity, hasPassword, outdated, diff --git a/Fk/Pages/Lobby.qml b/Fk/Pages/Lobby.qml index f376fd2d..f6c9e57f 100644 --- a/Fk/Pages/Lobby.qml +++ b/Fk/Pages/Lobby.qml @@ -11,10 +11,13 @@ import "Logic.js" as Logic Item { id: root property alias roomModel: roomModel + property var roomInfoCache: ({}) property string password + /* Rectangle { + visible: false width: parent.width / 2 - roomListLayout.width / 2 - 50 height: parent.height * 0.7 anchors.top: exitButton.bottom @@ -46,75 +49,91 @@ Item { } } } + */ Component { id: roomDelegate - Item { - height: 48 - width: roomList.width + Rectangle { + radius: 8 + height: 124 - 8 + width: 124 - 8 + color: "lightgreen" - RowLayout { - anchors.fill: parent - spacing: 16 - Text { - text: roomId - color: "grey" - } + Text { + id: roomNameText + horizontalAlignment: Text.AlignLeft + width: parent.width - 16 + height: contentHeight + maximumLineCount: 2 + wrapMode: Text.WrapAnywhere + textFormat: Text.PlainText + text: roomName + // color: outdated ? "gray" : "black" + font.pixelSize: 16 + // elide: Label.ElideRight + anchors.top: parent.top + anchors.left: parent.left + anchors.margins: 8 + } - Text { - horizontalAlignment: Text.AlignLeft - Layout.fillWidth: true - text: { - let ret = roomName; - if (outdated) { - ret = '' + ret + ''; - } - return ret; - } - font.pixelSize: 20 - elide: Label.ElideRight - } + Text { + id: roomIdText + text: luatr(gameMode) + ' #' + roomId + anchors.top: roomNameText.bottom + anchors.left: roomNameText.left + } - Item { - Layout.preferredWidth: 16 - Image { - source: AppPath + "/image/button/skill/locked.png" - visible: hasPassword - anchors.centerIn: parent - scale: 0.8 - } - } + Image { + source: AppPath + "/image/button/skill/locked.png" + // visible: hasPassword + scale: 0.8 + anchors.bottom: parent.bottom + anchors.left: parent.left + anchors.margins: -4 + } - Text { - text: luatr(gameMode) - } + Text { + color: (playerNum == capacity) ? "red" : "black" + text: playerNum + "/" + capacity + font.pixelSize: 18 + font.bold: true + anchors.bottom: parent.bottom + anchors.bottomMargin: 8 + anchors.right: parent.right + anchors.rightMargin: 8 + } - Text { - color: (playerNum == capacity) ? "red" : "black" - text: playerNum + "/" + capacity - font.pixelSize: 20 - font.bold: true - } + // Button { + // text: (playerNum < capacity) ? luatr("Enter") : + // luatr("Observe") - Button { - text: (playerNum < capacity) ? luatr("Enter") : - luatr("Observe") + // enabled: !opTimer.running && !outdated - enabled: !opTimer.running && !outdated + // onClicked: { + // opTimer.start(); + // if (hasPassword) { + // lobby_dialog.sourceComponent = enterPassword; + // lobby_dialog.item.roomId = roomId; + // lobby_dialog.item.playerNum = playerNum; + // lobby_dialog.item.capacity = capacity; + // lobby_drawer.open(); + // } else { + // enterRoom(roomId, playerNum, capacity, ""); + // } + // } + // } - onClicked: { - opTimer.start(); - if (hasPassword) { - lobby_dialog.sourceComponent = enterPassword; - lobby_dialog.item.roomId = roomId; - lobby_dialog.item.playerNum = playerNum; - lobby_dialog.item.capacity = capacity; - lobby_drawer.open(); - } else { - enterRoom(roomId, playerNum, capacity, ""); - } - } + TapHandler { + gesturePolicy: TapHandler.WithinBounds + enabled: !opTimer.running && !outdated + + onTapped: { + lobby_dialog.sourceComponent = roomDetailDialog; + //lobby_dialog.item.roomId = roomId; + //lobby_dialog.item.playerNum = playerNum; + //lobby_dialog.item.capacity = capacity; + lobby_drawer.open(); } } } @@ -124,8 +143,7 @@ Item { id: roomModel } - PersonalSettings { - } + PersonalSettings {} Timer { id: opTimer @@ -134,69 +152,96 @@ Item { ColumnLayout { id: roomListLayout - anchors.top: parent.top - anchors.topMargin: 10 - anchors.horizontalCenter: parent.horizontalCenter - width: root.width * 0.48 - height: root.height - 80 - Button { - Layout.alignment: Qt.AlignRight - text: luatr("Refresh Room List") - enabled: !opTimer.running - onClicked: { - opTimer.start(); - ClientInstance.notifyServer("RefreshRoomList", ""); + height: root.height - 72 + y: 16 + anchors.left: parent.left + anchors.leftMargin: root.width * 0.05 + root.width * 0.9 * 0.8 % 128 / 2 + width: { + let ret = root.width * 0.90 * 0.8; + ret -= ret % 128; + return ret; + } + clip: true + + RowLayout { + Layout.fillWidth: true + Item { Layout.fillWidth: true } + Text { + width: parent.width + horizontalAlignment: Text.AlignHCenter + text: luatr("Room List").arg(roomModel.count) + } + Button { + Layout.alignment: Qt.AlignRight + text: luatr("Refresh Room List") + enabled: !opTimer.running + onClicked: { + opTimer.start(); + ClientInstance.notifyServer("RefreshRoomList", ""); + } + } + Button { + text: luatr("Create Room") + onClicked: { + lobby_dialog.sourceComponent = + Qt.createComponent("../LobbyElement/CreateRoom.qml"); + lobby_drawer.open(); + config.observing = false; + config.replaying = false; + } } } - Item { - Layout.fillWidth: true + + GridView { + id: roomList + cellWidth: 128 + cellHeight: 128 Layout.fillHeight: true - Rectangle { - anchors.fill: parent - anchors.centerIn: parent - color: "#88EEEEEE" - radius: 16 - Text { - width: parent.width - horizontalAlignment: Text.AlignHCenter - text: luatr("Room List").arg(roomModel.count) - } - ListView { - id: roomList - height: parent.height * 0.9 - width: parent.width * 0.95 - contentHeight: roomDelegate.height * count - ScrollBar.vertical: ScrollBar {} - anchors.centerIn: parent - delegate: roomDelegate - clip: true - model: roomModel - } - } + Layout.fillWidth: true + ScrollBar.vertical: ScrollBar {} + delegate: roomDelegate + clip: true + model: roomModel } } - Button { - id: createRoomButton - anchors.bottom: buttonRow.top + Rectangle { + id: serverInfoLayout + anchors.top: parent.top + anchors.topMargin: root.height * 0.05 anchors.right: parent.right - width: 120 - display: AbstractButton.TextUnderIcon - icon.name: "media-playback-start" - text: luatr("Create Room") - onClicked: { - lobby_dialog.sourceComponent = - Qt.createComponent("../LobbyElement/CreateRoom.qml"); - lobby_drawer.open(); - config.observing = false; - config.replaying = false; - } + anchors.rightMargin: root.width * 0.05 + // anchors.horizontalCenter: parent.horizontalCenter + height: root.height * 0.90 + width: root.width * 0.90 * 0.2 + color: "white" } RowLayout { id: buttonRow - anchors.right: parent.right + anchors.left: parent.left anchors.bottom: parent.bottom + width: parent.width + + Rectangle { + Layout.fillHeight: true + Layout.preferredWidth: childrenRect.width + 48 + + gradient: Gradient { + orientation: Gradient.Horizontal + GradientStop { position: 0.8; color: "white" } + GradientStop { position: 1.0; color: "transparent" } + } + Text { + x: 16; y: 4 + font.pixelSize: 16 + text: luatr("$OnlineInfo") + .arg(lobbyPlayerNum).arg(serverPlayerNum) + "\n" + + "Powered by FreeKill " + FkVersion + } + } + + Item { Layout.fillWidth: true } Button { text: luatr("Generals Overview") onClicked: { @@ -333,33 +378,17 @@ Item { property int lobbyPlayerNum: 0 property int serverPlayerNum: 0 + /* function updateOnlineInfo() { } onLobbyPlayerNumChanged: updateOnlineInfo(); onServerPlayerNumChanged: updateOnlineInfo(); - Rectangle { - id: info - color: "#88EEEEEE" - width: root.width * 0.23 // childrenRect.width + 8 - height: childrenRect.height + 4 - anchors.bottom: parent.bottom - anchors.left: parent.left - radius: 4 - - Text { - anchors.horizontalCenter: parent.horizontalCenter - x: 4; y: 2 - font.pixelSize: 16 - text: luatr("$OnlineInfo") - .arg(lobbyPlayerNum).arg(serverPlayerNum) + "\n" - + "Powered by FreeKill " + FkVersion - } - } - + /* ChatBox { id: lobbyChat + visible: false anchors.bottom: info.top width: info.width height: root.height * 0.6 @@ -367,6 +396,7 @@ Item { color: "#88EEEEEE" radius: 4 } + */ Danmaku { id: danmaku