РС
Маусым 21, 2020, 1:55 Т.Ж.

QML DATAEDIT

Здравствуйте, какой элемент QML можно использовать под редактирование даты? Мне нужен простой Edit, чтобы пользователь ввел 21052020 и ему автоматический точки расставились, т.е. стало 21.05.2020 и дальше не позволяло вводить. Я так понимаю, что это самому через функции нужно?
Функцию получении даты сделал. 

  1.  function addZero(value){
  2.         if(value<10){
  3.             return '0' + value
  4.         }
  5.         else{
  6.             return value
  7.         }
  8.     }
  9.  
  10.     function getFormat(date){
  11.         var year = date.getFullYear()
  12.         var month = date.getMonth()
  13.         var day = date.getDate()
  14.  
  15.         return addZero(day) + '.' + addZero(month+1) + '.' + year
  16.     }
Рекомендуем хостинг TIMEWEB
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.
3
252

Ол саған ұнайды ма? Әлеуметтік желілерде бөлісіңіз!

901
6
0
0
0
6
РС
  • Маусым 21, 2020, 5:26 Т.Ж.

Сделал элемент, все вводится. Осталось только проверить дату на корректность. Как быть? Есть метод isValid, но он почему-то работать не хочет. 

  1. import QtQuick 2.0
  2. import QtQuick.Controls 1.4
  3.  
  4. Item {
  5.     id: dateEdit
  6.  
  7.     readonly property date currentDate: calendar.selectedDate
  8.     readonly property bool isCalendarOpened: calendar.visible
  9.     property string color: "lightblue"
  10.  
  11.     signal calendarOpened;
  12.     signal calendarClosed;
  13.  
  14.     width: textField.width + btnOpen.width
  15.     height: textField.height
  16.  
  17.     Column {
  18.         id: column
  19.         spacing: 2
  20.  
  21.         Row {
  22.             spacing: 5
  23.             TextField {
  24.                 id: textField
  25.                 text: Qt.formatDate(calendar.selectedDate, "dd.MM.yyyy");
  26. //                readOnly: true
  27.                 Keys.onPressed:
  28.                   {
  29.                     if (text.isValid()) {
  30.                         console.log ( "Date " + " is a valid date")
  31.                     } else {
  32.                          console.log ("Date " + " is not a valid date")
  33.                     }
  34.                     console.log("Press = " + event.key)
  35.                     console.log("Current text is " + text)
  36.                   }
  37.                   Keys.onReleased:
  38.                   { text: "99.99.9999"
  39.                     console.log("Release = " + event.key)
  40.                     console.log("Current text is " + text)
  41.                   }
  42.                inputMask: "99.99.9999"
  43.                 inputMethodHints: Qt.ImhDigitsOnly
  44.                 Keys.onUpPressed:  calendar.__selectNextDay()
  45.                 Keys.onDownPressed: calendar.__selectPreviousDay()
  46.             }
  47.             Rectangle {
  48.                 id: btnOpen
  49.                 radius: 5
  50.                 width: 30
  51.                 height: textField.height
  52.                 color: dateEdit.color
  53.  
  54.                 Text {
  55.                     text: "*"
  56.                 }
  57.  
  58.                 MouseArea {
  59.                     anchors.fill: parent
  60.  
  61.                     onClicked: {
  62.                         dateEdit.isCalendarOpened ?  closeCalendar() : openCalendar()
  63.                     }
  64.                 }
  65.             }
  66.         }
  67.  
  68.         Calendar {
  69.             id: calendar
  70.             visible: false
  71.             dayOfWeekFormat: Locale.ShortFormat
  72.             onClicked: {
  73.                 closeCalendar()
  74.             }
  75.  
  76.             function open()
  77.             {
  78.                 visible = true
  79.             }
  80.  
  81.             function close()
  82.             {
  83.                 visible = false
  84.             }
  85.         }
  86.     }
  87.  
  88.     function openCalendar()
  89.     {
  90.         calendar.open()
  91.         calendarOpened()
  92.     }
  93.  
  94.     function closeCalendar()
  95.     {
  96.         calendar.close()
  97.         calendarClosed()
  98.     }
  99. }
  100.  
    0
    0
    0
    РС
    • Маусым 21, 2020, 11:32 Т.Ж.
    • (өңделген)

    Доделал, но остался единственный баг с месяцами: число он нормально отрабатывает, а если ввожу месяц и стоит 06, то получается 16, то он сбрасывается. Как исправить? 

    1. import QtQuick 2.0
    2. import QtQuick.Controls 1.4
    3.  
    4.  
    5.  
    6.  
    7.  
    8. Item {
    9.     id: dateEdit
    10.  
    11.     readonly property date currentDate: calendar.selectedDate
    12.     readonly property bool isCalendarOpened: calendar.visible
    13.     property string color: "lightblue"
    14.  
    15.     signal calendarOpened;
    16.     signal calendarClosed;
    17.  
    18.     width: textField.width + btnOpen.width
    19.     height: textField.height
    20.  
    21.     Column {
    22.         id: column
    23.         spacing: 2
    24.  
    25.         Row {
    26.             spacing: 5
    27.             TextField {
    28.                 id: textField
    29.                 text: Qt.formatDate(calendar.selectedDate, "dd.MM.yyyy");
    30.                 //                readOnly: true
    31.  
    32.                 function validate_date(value)
    33.                 {
    34.                     var arrD = value.split(".");
    35.                     arrD[1] -= 1;
    36.                     var d = new Date(arrD[2], arrD[1], arrD[0]);
    37.                     if ((d.getFullYear() == arrD[2]) && (d.getMonth() == arrD[1]) && (d.getDate() == arrD[0])) {
    38.                         return true;
    39.                     } else {
    40.  
    41.                         return false;
    42.                     }
    43.                 }
    44.  
    45.                 function getMonth(value)
    46.                 {
    47.                     var arrm = value.split(".");
    48.                     arrm[1] -= 0;
    49.                         return arrm[1];
    50.  
    51.                 }
    52.  
    53.                 function getDay(value)
    54.                 {
    55.                     var arrd = value.split(".");
    56.                     arrd[0] -= 0;
    57.                         return arrd[0];
    58.  
    59.                 }
    60.  
    61.                 Keys.onReleased:
    62.                {validate_date(text)?console.log("Current data: "+(text.substring(3,5))):{text=Qt.formatDate(calendar.selectedDate, "dd.MM.yyyy")}}
    63.                 inputMask: "99.99.9999"
    64.                 inputMethodHints: Qt.ImhDigitsOnly
    65.                 Keys.onUpPressed:  calendar.__selectNextDay()
    66.                 Keys.onDownPressed: calendar.__selectPreviousDay()
    67.             }
    68.             Rectangle {
    69.                 id: btnOpen
    70.                 radius: 5
    71.                 width: 30
    72.                 height: textField.height
    73.                 color: dateEdit.color
    74.  
    75.                 Text {
    76.                     text: "*"
    77.                 }
    78.  
    79.                 MouseArea {
    80.                     anchors.fill: parent
    81.  
    82.                     onClicked: {
    83.                         dateEdit.isCalendarOpened ?  closeCalendar() : openCalendar()
    84.                     }
    85.                 }
    86.             }
    87.         }
    88.  
    89.         Calendar {
    90.             id: calendar
    91.             visible: false
    92.             dayOfWeekFormat: Locale.ShortFormat
    93.             onClicked: {
    94.                 closeCalendar()
    95.             }
    96.  
    97.             function open()
    98.             {
    99.                 visible = true
    100.             }
    101.  
    102.             function close()
    103.             {
    104.                 visible = false
    105.             }
    106.         }
    107.     }
    108.  
    109.     function openCalendar()
    110.     {
    111.         calendar.open()
    112.         calendarOpened()
    113.     }
    114.  
    115.     function closeCalendar()
    116.     {
    117.         calendar.close()
    118.         calendarClosed()
    119.     }
    120. }
      0
      0
      0
      S
      • Маусым 21, 2020, 4:54 Т.Қ.
      • (өңделген)

      Либо, это не полный код, либо... Просто непонятно откуда взялся массив arrm в функции getMounth , так как вы используете arrd

        0
        0
        0
        РС
        • Маусым 21, 2020, 4:56 Т.Қ.

        там несколько функций

          0
          0
          0
          РС
          • Маусым 23, 2020, 12:15 Т.Ж.

          Доделал 

          1. import QtQuick 2.0
          2. import QtQuick.Controls 1.4
          3.  
          4. Item {
          5.     id: dateEdit
          6.  
          7.     readonly property date currentDate: calendar.selectedDate
          8.     readonly property bool isCalendarOpened: calendar.visible
          9.     property string color: "lightblue"
          10.  
          11.     signal calendarOpened;
          12.     signal calendarClosed;
          13.  
          14.     width: textFielddata.width + btnOpen.width
          15.     height: textFielddata.height
          16.  
          17.     Column {
          18.         id: column
          19.         spacing: 2
          20.  
          21.         Row {
          22.             spacing: 5
          23.             TextField {
          24.                 id: textFielddata
          25.                 text: Qt.formatDate(calendar.selectedDate, "dd.MM.yyyy");
          26.                 //                readOnly: true
          27.  
          28.                 function validate_date(value)
          29.                 {
          30.                     var arrD = value.split(".");
          31.                     arrD[1] -= 1;
          32.                     var d = new Date(arrD[2], arrD[1], arrD[0]);
          33.                     if ((d.getFullYear() == arrD[2]) && (d.getMonth() == arrD[1]) && (d.getDate() == arrD[0])) {
          34.                         return true;
          35.                     } else {
          36.  
          37.                         return false;
          38.                     }
          39.                 }
          40.  
          41.  
          42.                 validator: RegExpValidator { regExp: /^([0-2]?[1-9]|3[0-9]).(0?[1-9]|1[0-9]).([0-9][0-9][0-9][0-9])$ / } // /^([0-2]?[1-9]|3[0-1]).(0?[1-9]|1[0-2]).([0-9][0-9][0-9][0-9])$ /
          43.                 Keys.onReleased:
          44.                 {if (validate_date(text)) {console.log("Current data: "+(text))} else if ([text[3]].toString() == "1") {text=text.substring(0,4)+0+text.substring(5);textFielddata.cursorPosition=5} else if ([text[0]].toString() == "3"&&([text[1]].toString()!="0")&&([text[1]].toString()!="1"))  {text=text.substring(0,1)+0+text.substring(2);textFielddata.cursorPosition=1} else {text="01"+text.substring(2);textFielddata.cursorPosition=0}}
          45.                 inputMask:"99.99.9999";
          46.                 inputMethodHints: Qt.ImhDigitsOnly
          47.                 Keys.onUpPressed:  calendar.__selectNextDay()
          48.                 Keys.onDownPressed: calendar.__selectPreviousDay()
          49.             }
          50.             Rectangle {
          51.                 id: btnOpen
          52.                 radius: 5
          53.                 width: 30
          54.                 height: textFielddata.height
          55.                 color: dateEdit.color
          56.  
          57.                 Text {
          58.                     text: "*"
          59.                 }
          60.  
          61.                 MouseArea {
          62.                     anchors.fill: parent
          63.  
          64.                     onClicked: {
          65.                         dateEdit.isCalendarOpened ?  closeCalendar() : openCalendar()
          66.                     }
          67.                 }
          68.             }
          69.         }
          70.  
          71.         Calendar {
          72.             id: calendar
          73.             visible: false
          74.             dayOfWeekFormat: Locale.ShortFormat
          75.             onClicked: {
          76.                 closeCalendar()
          77.             }
          78.  
          79.             function open()
          80.             {
          81.                 function get_date(value)
          82.                 {
          83.                     var arrD = value.split(".");
          84.                     arrD[1] -= 1;
          85.                     var d = new Date(arrD[2], arrD[1], arrD[0]);
          86.                     if ((d.getFullYear() == arrD[2]) && (d.getMonth() == arrD[1]) && (d.getDate() == arrD[0])) {
          87.                         return d;
          88.                     } else {
          89.  
          90.                         return false;
          91.                     }}
          92.  
          93.                 calendar.selectedDate=new Date(get_date(textFielddata.text));
          94.                 visible = true
          95.  
          96.             }
          97.  
          98.             function close()
          99.             {
          100.                 visible = false
          101.             }
          102.         }
          103.     }
          104.  
          105.     function openCalendar()
          106.     {
          107.         calendar.open()
          108.         calendarOpened()
          109.     }
          110.  
          111.     function closeCalendar()
          112.     {
          113.         calendar.close()
          114.         calendarClosed()
          115.     }
          116. }
          117.  
          118. Вызов
          119.  
          120. import QtQuick 2.9
          121. import QtQuick.Window 2.2
          122. import QtQuick.Controls 2.5
          123. import QtQuick.Controls 2.5
          124.  
          125. Window {
          126.     visible: true
          127.     width: 640
          128.     height: 480
          129.     title: qsTr("QML DATAEDIT тест")
          130.  
          131.     QmlDateEdit{
          132.  
          133.     }
          134.  
          135. }
          136.  
            0
            2
            0
            РС
            • Маусым 27, 2020, 7:23 Т.Қ.
            • (өңделген)

            Доработка функции: 

            1. Доработка функции:
            2. function open()
            3.             {
            4.                 function get_date(value)
            5.                 {
            6.                     var arrD = value.split(".");
            7.                     arrD[1] -= 1;
            8.                     var d = new Date(arrD[2], arrD[1], arrD[0]);
            9.                     if ((d.getFullYear() == arrD[2]) && (d.getMonth() == arrD[1]) && (d.getDate() == arrD[0])) {
            10.                         return d;
            11.                     } else {
            12.  
            13.                         return false;
            14.                     }}
            15.  
            16.                 calendar.selectedDate=new Date(get_date(textFielddata.text));
            17.                 visible = true
            18.  
            19.             }
              0
              0
              0

              Пікірлер

              Тек рұқсаты бар пайдаланушылар ғана пікір қалдыра алады.
              Кіріңіз немесе Тіркеліңіз
              Actions
              Мақала жазуСұрақ қоюТест тапсырыңызКодты бөлісу