qt qml實現電話簿 通訊錄

?qml實現電話簿，基于github上開源代碼修改而來，增加了搜索和展開，效果如下

代碼如下

#include <QGuiApplication>
#include <QQmlApplicationEngine>int main(int argc, char *argv[])
{QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);QGuiApplication app(argc, argv);QQmlApplicationEngine engine;engine.load(QUrl(QStringLiteral("qrc:/main.qml")));if (engine.rootObjects().isEmpty())return -1;return app.exec();
}

import QtQuick 2.7
import QtQuick.Layouts 1.1
import QtQuick.Controls 2.1
import "./Pinyin.js" as PinyinUtilItem {width: 320height: 480property int expandedIndex: -1property string searchKeyword: ""// ? 固定聯系人數據：姓名 + 電話統一管理property var contacts: [{"name": "皮皮",       "phone1": "029-8888-1111", "phone2": "138-1234-5678", "phone3": "029-6666-2222"},{"name": "日歷",       "phone1": "029-8888-2222", "phone2": "139-8765-4321", "phone3": "029-6666-3333"},{"name": "父親",       "phone1": "029-8888-3333", "phone2": "136-1122-3344", "phone3": "029-6666-4444"},{"name": "額額額",     "phone1": "029-8888-4444", "phone2": "135-5555-6666", "phone3": "029-6666-5555"},{"name": "高大上",     "phone1": "029-8888-5555", "phone2": "134-7777-8888", "phone3": "029-6666-6666"},{"name": "黑鳳梨",     "phone1": "029-8888-6666", "phone2": "137-9999-0000", "phone3": "029-6666-7777"},{"name": "阿文",       "phone1": "029-8888-7777", "phone2": "133-1111-2222", "phone3": "029-6666-8888"},{"name": "阿南",       "phone1": "029-8888-8888", "phone2": "132-3333-4444", "phone3": "029-6666-9999"},{"name": "#特殊",      "phone1": "029-8888-9999", "phone2": "131-5555-6666", "phone3": "029-6666-0000"},{"name": "*特殊",      "phone1": "029-8888-0000", "phone2": "130-7777-8888", "phone3": "029-6666-1111"},{"name": "aaa",        "phone1": "029-8888-1111", "phone2": "138-1234-5678", "phone3": "029-6666-2222"},{"name": "AAA",        "phone1": "029-8888-2222", "phone2": "139-8765-4321", "phone3": "029-6666-3333"},{"name": "a啊a",       "phone1": "029-8888-3333", "phone2": "136-1122-3344", "phone3": "029-6666-4444"},{"name": "啊aa",       "phone1": "029-8888-4444", "phone2": "135-5555-6666", "phone3": "029-6666-5555"},{"name": "阿亮",       "phone1": "029-8888-5555", "phone2": "134-7777-8888", "phone3": "029-6666-6666"},{"name": "1阿1",       "phone1": "029-8888-6666", "phone2": "137-9999-0000", "phone3": "029-6666-7777"},{"name": "爸爸",       "phone1": "029-8888-7777", "phone2": "133-1111-2222", "phone3": "029-6666-8888"},{"name": "第八個",     "phone1": "029-8888-8888", "phone2": "132-3333-4444", "phone3": "029-6666-9999"},{"name": "奶奶",       "phone1": "029-8888-9999", "phone2": "131-5555-6666", "phone3": "029-6666-0000"},{"name": "叔叔",       "phone1": "029-8888-0000", "phone2": "130-7777-8888", "phone3": "029-6666-1111"},{"name": "智障啊",     "phone1": "029-8888-1111", "phone2": "138-1234-5678", "phone3": "029-6666-2222"},{"name": "滿意",       "phone1": "029-8888-2222", "phone2": "139-8765-4321", "phone3": "029-6666-3333"},{"name": "歲月",       "phone1": "029-8888-3333", "phone2": "136-1122-3344", "phone3": "029-6666-4444"},{"name": "可能",       "phone1": "029-8888-4444", "phone2": "135-5555-6666", "phone3": "029-6666-5555"},{"name": "黃河",       "phone1": "029-8888-5555", "phone2": "134-7777-8888", "phone3": "029-6666-6666"}]Item {width: parent.widthheight: parent.heightanchors.centerIn: parentRectangle {anchors.fill: parentcolor: "#f0f0f0"}// 搜索框Item {width: parent.widthheight: 50anchors.top: parent.topRectangle {width: parent.width - 40height: 30anchors.centerIn: parentradius: 15color: "#ffffff"border.color: "#cccccc"border.width: 1Item {width: parent.widthheight: parent.heightImage {source: "qrc:/search.png"width: 15height: 15anchors.left: parent.leftanchors.leftMargin: 8anchors.verticalCenter: parent.verticalCenter}TextField {width: parent.width - 40height: parent.heightanchors.left: parent.leftanchors.leftMargin: 23anchors.right: parent.rightanchors.rightMargin: 8placeholderText: "搜索聯系人..."font.pixelSize: 14color: "#333333"background: Item {}onTextChanged: {searchKeyword = textfilterContacts()}}}}}// 分組標題Component {id: sectionHeaderItem {width: 80height: 30Text {text: section.toUpperCase()font.pixelSize: 16anchors.left: parent.leftanchors.leftMargin: 8color: "#666666"anchors.bottom: parent.bottom}}}// 聯系人列表ListView {id: listViewwidth: parent.widthheight: parent.height - 50anchors.bottom: parent.bottomclip: truemodel: searchKeyword.length > 0 ? filteredModel : testModeldelegate: Item {width: parent.widthheight: isExpanded ? 100 : 35readonly property int itemIndex: indexreadonly property bool isExpanded: listView.parent.parent.expandedIndex === itemIndexreadonly property string phone1: model.phone1readonly property string phone2: model.phone2readonly property string phone3: model.phone3// 展開時背景為白色Rectangle {anchors.fill: parentcolor: isExpanded ? "#ffffff" : "transparent"}// 聯系人基本信息區域Item {width: parent.widthheight: 35Rectangle {width: parent.widthheight: 35color: "transparent"MouseArea {anchors.fill: parentacceptedButtons: Qt.LeftButtononClicked: {if (isExpanded) {listView.parent.parent.expandedIndex = -1} else {listView.parent.parent.expandedIndex = itemIndex}}}Text {text: listView.getShowTextSpecial(model.name)anchors.verticalCenter: parent.verticalCentercolor: "#333333"font.pixelSize: 16x: 24}}}// 電話信息區域（可展開）Item {y: 35width: parent.widthheight: isExpanded ? 65 : 0opacity: isExpanded ? 1 : 0Behavior on opacity { NumberAnimation { duration: 200 } }Behavior on height { NumberAnimation { duration: 200 } }// 三個電話號碼（帶標簽）Text {text: "單位電話：" + phone1y: 0x: 48color: "#333333"font.pixelSize: 14}Text {text: "家庭座機：" + phone3y: 20x: 48color: "#333333"font.pixelSize: 14}Text {text: "手機：" + phone2y: 40x: 48color: "#333333"font.pixelSize: 14}}}ScrollIndicator.vertical: ScrollIndicator {anchors.right: parent.rightanchors.rightMargin: 8contentItem: Rectangle {implicitWidth: 3radius: implicitWidth / 2color: "#cccccc"}}function getShowTextSpecial(str) {var first = str[0]if (first === "#") return str.substr(1)return str}section.property: "pinyin"section.criteria: ViewSection.FirstCharactersection.delegate: sectionHeader}// 右側字母欄Item {width: 30height: parent.height - 50anchors.top: parent.topanchors.topMargin: 50anchors.right: parent.rightanchors.rightMargin: 5MouseArea {anchors.fill: parentfunction changeBigText() {bigTip.visible = truevar index = parseInt(mouseY / 10)if (index < 0) index = 0if (index > 26) index = 26bigText.text = qsTr(letters[index] + "")var search_index = getIndexByLab(bigText.text)if (search_index >= 0)listView.positionViewAtIndex(search_index, ListView.Beginning)}function getIndexByLab(lab) {for (var i = 0; i < testModel.count; i++) {if (testModel.get(i).pinyin.substr(0, 1).toUpperCase() === lab) {return i}}return -1}onPositionChanged: changeBigText()onPressed: changeBigText()onReleased: bigTip.visible = false}Column {spacing: 0Repeater {model: lettersdelegate: Text {width: 30height: 14text: modelDatafont.pixelSize: 12color: "#666666"horizontalAlignment: Text.AlignHCenterverticalAlignment: Text.AlignVCenter}}}}// 大字母提示Rectangle {width: 30height: widthradius: width / 2color: "#ffffff"anchors.centerIn: parentvisible: falseid: bigTipText {id: bigTexttext: qsTr("A")font.pixelSize: 16color: "#333333"anchors.centerIn: parent}}}property var letters: ["A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z","#"]function generateData(contact) {var name = contact.namevar pinyin = PinyinUtil.pinyin.getFullChars(name)return {name: name,pinyin: pinyin,phone1: contact.phone1,phone2: contact.phone2,phone3: contact.phone3}}function chack_special(str) {var pattern1 = new RegExp("[`～!@#$^&*()=|{}':;',\\[\\].<>《》/?～！@#￥……&*（）——|{}【】‘；：”“'。，、？ ]")var pattern2 = /^[0-9]*$/return pattern1.test(str) || pattern2.test(str)}function moveFirstToEnd(array) {var first = array[0]array.push(first)array.shift()}ListModel {id: filteredModel}function filterContacts() {filteredModel.clear()if (searchKeyword.length === 0) returnfor(var i = 0; i < testModel.count; i++) {var item = testModel.get(i)if (item.name.toLowerCase().indexOf(searchKeyword.toLowerCase()) !== -1 ||item.pinyin.toLowerCase().indexOf(searchKeyword.toLowerCase()) !== -1) {filteredModel.append(generateData(item))}}}ListModel {id: testModelComponent.onCompleted: {var resultArray = []for (var i = 0; i < contacts.length; i++) {var contact = contacts[i]var pinyin = PinyinUtil.pinyin.getFullChars(contact.name)resultArray.push({name: contact.name,pinyin: pinyin,phone1: contact.phone1,phone2: contact.phone2,phone3: contact.phone3})}resultArray.sort(function(a, b) {return a.pinyin.localeCompare(b.pinyin)})var specialNumber = 0for (var i = 0; i < resultArray.length; i++) {if (chack_special(resultArray[i].name.substr(0, 1))) {resultArray[i].name = "#" + resultArray[i].namespecialNumber++}}for (i = 0; i < specialNumber; i++) moveFirstToEnd(resultArray)for (i = 0; i < resultArray.length; i++) {testModel.append(resultArray[i])}}}
}

源碼地址，歡迎star

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/pingmian/92346.shtml
繁體地址，請注明出處：http://hk.pswp.cn/pingmian/92346.shtml
英文地址，請注明出處：http://en.pswp.cn/pingmian/92346.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

順序表——C語言

順序表——C語言

順序表實現代碼解析與學習筆記一、順序表基礎概念順序表是線性表的一種順序存儲結構&#xff0c;它使用一段連續的內存空間&#xff08;數組&#xff09;存儲數據元素&#xff0c;通過下標直接訪問元素&#xff0c;具有隨機訪問的特性。其核心特點是&#xff1a;元素在內存中連…
閱讀更多...
【Oracle篇】Oracle Data Pump遠程備份技術：直接從遠端數據庫備份至本地環境

【Oracle篇】Oracle Data Pump遠程備份技術：直接從遠端數據庫備份至本地環境

&#x1f4ab;《博主主頁》&#xff1a; 　　　&#x1f50e; CSDN主頁__奈斯DB 　　　&#x1f50e; IF Club社區主頁__奈斯、 &#x1f525;《擅長領域》&#xff1a;擅長阿里云AnalyticDB for MySQL(分布式數據倉庫)、Oracle、MySQL、Linux、prometheus監控&#xff1b;并對…
閱讀更多...
Linux系統--文件系統

Linux系統--文件系統

大家好&#xff0c;我們今天繼續來學習Linux系統部分。上一次我們學習了內存級的文件&#xff0c;下面我們來學習磁盤級的文件。那么話不多說&#xff0c;我們開始今天的學習&#xff1a; 目錄 Ext系列?件系統 1. 理解硬件 1-1 磁盤、服務器、機柜、機房 1-2 磁盤物理結構…
閱讀更多...
KUKA庫卡焊接機器人氬氣節氣設備

KUKA庫卡焊接機器人氬氣節氣設備

在焊接生產過程中&#xff0c;氬氣作為一種重要的保護氣體被廣泛應用于KUKA庫卡焊接機器人的焊接操作中。氬氣的消耗往往是企業生產成本的一個重要組成部分&#xff0c;因此實現庫卡焊接機器人節氣具有重要的經濟和環保意義。WGFACS節氣裝置的出現為解決這一問題提供了有效的方…
閱讀更多...
遠程連接----ubuntu ，rocky 等Linux系統，WindTerm_2.7.0

遠程連接----ubuntu ，rocky 等Linux系統，WindTerm_2.7.0

新一代開源免費的終端工具-WindTerm github 27.5k? https://github.com/kingToolbox/WindTerm/releases/download/2.7.0/WindTerm_2.7.0_Windows_Portable_x86_64.zip 主機填寫你自己要連接的主機ip 端口默認 22 改成你ssh文件配置的端口 輸入遠程的 用戶名 與密碼 成功連接…
閱讀更多...
筆試——Day32

筆試——Day32

文章目錄第一題題目思路代碼第二題題目&#xff1a;思路代碼第三題題目&#xff1a;思路代碼第一題 題目 素數回文 思路 模擬 構建新的數字&#xff0c;判斷該數是否為素數 代碼 第二題 題目&#xff1a; 活動安排 思路 區間問題的貪?&#xff1a;排序&#xff0c;然…
閱讀更多...
超高車輛如何影響城市立交隧道安全？預警系統如何應對？

超高車輛如何影響城市立交隧道安全？預警系統如何應對？

超高車輛對立交隧道安全的潛在威脅在城市立交和隧道中&#xff0c;限高設施的設計通常考慮到大部分正常通行的貨車和運輸車輛。然而&#xff0c;一些超高的貨車、集裝箱車或特殊車輛如果未經有效監測而進入限高區域&#xff0c;就可能對道路設施造成極大的安全隱患。尤其在立交…
閱讀更多...
解決 MinIO 上傳文件時報 S3 API Requests must be made to API port錯誤

解決 MinIO 上傳文件時報 S3 API Requests must be made to API port錯誤

在使用 MinIO 進行文件上傳時&#xff0c;我遇到了一個比較坑的問題。錯誤日志如下&#xff1a; io.minio.errors.InvalidResponseException: Non-XML response from server. Response code: 400, Content-Type: text/xml; charsetutf-8, body: <?xml version"1.0&quo…
閱讀更多...
linux_https，udp，tcp協議（更新中）

linux_https，udp，tcp協議（更新中）

目錄 https 加密類型 對稱加密 非對稱加密 加密方案 只用對程加密 只用非對程加密 雙方都是用非對程加密 非對稱對稱加密 非對稱對稱加密證書 流程圖 校驗流程圖 udp udp協議格式 特點 UDP緩沖區 tcp tcp協議格式 32位序號及確認序號 4位首部 6位標志位 1…
閱讀更多...
web端-登錄頁面驗證碼的實現(springboot+vue前后端分離)超詳細

web端-登錄頁面驗證碼的實現(springboot+vue前后端分離)超詳細

目錄 一、項目技術棧 二、實現效果圖 ?三、實現路線 四、驗證碼的實現步驟 五、完整代碼 1.前端 2.后端 一、項目技術棧 登錄頁面暫時涉及到的技術棧如下: 前端 Vue2 Element UI Axios&#xff0c;后端 Spring Boot 2 MyBatis MySQL JWT Maven 二、實現效果圖…
閱讀更多...
瘋狂星期四文案網第33天運營日記

瘋狂星期四文案網第33天運營日記

網站運營第33天&#xff0c;點擊觀站&#xff1a; 瘋狂星期四 crazy-thursday.com 全網最全的瘋狂星期四文案網站 運營報告 今日訪問量 今日搜索引擎收錄情況 必應收錄239個頁面&#xff0c;還在持續增加中&#xff0c;已經獲得必應的認可&#xff0c;逐漸收錄所有頁面 百度…
閱讀更多...
客戶端利用MinIO對服務器數據進行同步

客戶端利用MinIO對服務器數據進行同步

MinIO 是一款高性能、開源的對象存儲服務&#xff0c;專為海量數據存儲設計&#xff0c;兼容 Amazon S3 API&#xff08;即與 AWS S3 協議兼容&#xff09;&#xff0c;可用于構建私有云存儲、企業級數據湖、備份歸檔系統等場景。它以輕量、靈活、高效為核心特點&#xff0c;廣…
閱讀更多...
WPF 雙擊行為實現詳解：DoubleClickBehavior 源碼分析與實戰指南

WPF 雙擊行為實現詳解：DoubleClickBehavior 源碼分析與實戰指南

WPF 雙擊行為實現詳解：DoubleClickBehavior 源碼分析與實戰指南 文章目錄 WPF 雙擊行為實現詳解：DoubleClickBehavior 源碼分析與實戰指南 引言 一、行為（Behavior）基礎概念 1.1 什么是行為？ 1.2 行為的優勢 二、DoubleClickBehavior 源碼分析 2.1 類定義與依賴屬性 2.2 雙…
閱讀更多...
零知開源——基于STM32F103RBT6的TDS水質監測儀數據校準和ST7789顯示實戰教程

零知開源——基于STM32F103RBT6的TDS水質監測儀數據校準和ST7789顯示實戰教程

?零知開源是一個真正屬于國人自己的開源軟硬件平臺&#xff0c;在開發效率上超越了Arduino平臺并且更加容易上手&#xff0c;大大降低了開發難度。零知開源在軟件方面提供了完整的學習教程和豐富示例代碼&#xff0c;讓不懂程序的工程師也能非常輕而易舉的搭建電路來創作產品&…
閱讀更多...
luogu P3387 【模板】縮點

luogu P3387 【模板】縮點

原題鏈接 原題再現 題目描述 給定一個 n 個點 m 條邊有向圖&#xff0c;每個點有一個權值&#xff0c;求一條路徑&#xff0c;使路徑經過的點權值之和最大。你只需要求出這個權值和。 允許多次經過一條邊或者一個點&#xff0c;但是&#xff0c;重復經過的點&#xff0c;權…
閱讀更多...
P1119 災后重建【題解】

P1119 災后重建【題解】

P1119 災后重建 題目背景 B 地區在地震過后&#xff0c;所有村莊都造成了一定的損毀&#xff0c;而這場地震卻沒對公路造成什么影響。但是在村莊重建好之前&#xff0c;所有與未重建完成的村莊的公路均無法通車。換句話說&#xff0c;只有連接著兩個重建完成的村莊的公路才能通…
閱讀更多...
Horse3D引擎研發筆記（二）：基于QtOpenGL使用仿Three.js的BufferAttribute結構重構三角形繪制

Horse3D引擎研發筆記（二）：基于QtOpenGL使用仿Three.js的BufferAttribute結構重構三角形繪制

在Horse3D引擎的研發過程中&#xff0c;我們致力于構建一個高效、靈活且易于擴展的3D圖形引擎。在本篇博客中&#xff0c;我們將詳細記錄如何基于QtOpenGL框架&#xff0c;使用仿Three.js的BufferAttribute結構&#xff0c;重構三角形繪制流程。通過這一過程&#xff0c;我們希…
閱讀更多...
MCU程序段的分類

MCU程序段的分類

程序的下載&#xff08;燒錄到存儲器中&#xff09;通常是按照程序文件分段&#xff08;Code段、RO_data段、RW_data段、ZI_data段&#xff09;的方式存儲的&#xff0c;但運行時內存的布局會按照程序進程分段&#xff08;TEXT段、DATA段、BSS段、堆棧段&#xff09;進行組織。…
閱讀更多...
綜合項目記錄：自動化備份全網服務器數據平臺

綜合項目記錄：自動化備份全網服務器數據平臺

一、項目背景與需求1.1項目概述該項目共分為2個子項目&#xff0c;由環境搭建和實施備份兩部分組成1.2項目總體需求企業內部有一臺web服務器&#xff0c;內部數據很重要&#xff0c;現需要為該web服務器數據做備份&#xff0c;這樣在數據丟失時可以恢復。要求如下&#xff1a;每…
閱讀更多...
聯合索引全解析：一棵樹，撐起查詢的半邊天

聯合索引全解析：一棵樹，撐起查詢的半邊天

目錄 一、為什么聯合索引是MySQL性能優化的“王牌”&#xff1f; &#xff08;一&#xff09;索引的基本結構&#xff1a;從聚簇到非聚簇 1. 聚簇索引&#xff08;Clustered Index&#xff09; 2. 非聚簇索引&#xff08;Secondary Index&#xff09; &#xff08;二&…
閱讀更多...
最新文章

Copyright @ 2022~2023