กระดานข่าว VB › เว็บบอร์ดถามตอบปัญหา › ขอวิธีสร้าง countdown ใน datagridview แต่ละ Rows หน่อยครับ

komenservice โพสต์ 2021-4-30 15:55:03

ขอวิธีสร้าง countdown ใน datagridview แต่ละ Rows หน่อยครับ

ผมอย่างสร้าง สร้าง columns countdown ใน datagridview แต่ละ Rows หน่อยครับ

มีท่านใด มีแนวทางไหมครับ

ขอบรุณครับ

thongkorn โพสต์ 2021-5-1 21:33:09

Column CountDown ไม่จำเป็นต้องเก็บไว้ในตารางข้อมูล แต่สร้างมาจากตารางกริด โดยเอาหลัก Deadline มาทำการคำนวณหาครับ โค้ดตัวอย่างการหาค่าความแตกต่างของวัน เวลา
      Dim StartDate As Date = "23/05/2564 00:00:00" '// วันครบกำหนด
      Dim EndDate As Date = Date.Now
      Dim TimeSpan As TimeSpan = StartDate.Subtract(EndDate)
      Dim DifDays As Integer = TimeSpan.Days
      Dim DifHr As Integer = TimeSpan.Hours
      Dim DifMin As Integer = TimeSpan.Minutes
      MessageBox.Show("จำนวนวัน: " & DifDays & vbCrLf & "จำนวนชั่วโมง: " & DifHr & vbCrLf & "จำนวนนาที: " & DifMin)

หากอยากให้แสดงผลเป็นแบบ Real Time เพื่อนับเวลาอยู่ตลอด ก็ต้องใช้ Timer เข้าช่วย โดยการวนรอบแถวในตารางกริดตามเวลาที่ตั้งไว้ว่าจะเอาวินาที หรือนาที ซึ่งจะทำอยู่ในส่วนของ Timer ครับ

thongkorn โพสต์ 2021-5-2 10:50:59

อันนี้โค้ดทดสอบการนับตัวเลขลงในตารางกริด การนับถอยหลังเวลาก็จะคล้ายๆกันครับ    Private Sub frmCountDownGrid_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
      DataGridView1.ColumnCount = 3
      DataGridView1.Columns(0).Name = "Job Name"
      DataGridView1.Columns(1).Name = "Number"
      DataGridView1.Columns(2).Name = "Countdown"
      DataGridView1.Rows.Add({"Job 1", 3, 3})
      DataGridView1.Rows.Add({"Job 2", 5, 5})
      Timer1.Interval = 1000
      Timer1.Enabled = True
    End Sub

    Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
      For row As Integer = 0 To DataGridView1.Rows.Count - 1
            Dim num As Integer = DataGridView1.Rows(row).Cells(2).Value
            If num <> 0 Then DataGridView1.Rows(row).Cells(2).Value = num - 1
      Next
    End Sub

thongkorn โพสต์ 2021-5-2 11:38:23

ตอบให้เป็นโค้ดแบบเต็มๆเลยดีกว่าครับ Add DataGridView1 และ Timer1 เข้าไปในฟอร์ม ...
    Private Sub frmCountDownGrid_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
      With DataGridView1
            '// Autosize Column
            .AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill
            .AllowUserToAddRows = False
      End With
      With DataGridView1
            .ColumnCount = 3
            .Columns(0).Name = "Job Name"
            .Columns(1).Name = "Deadline"
            .Columns(2).Name = "Countdown"
            .Rows.Add({"Job 1", "23/05/2564 00:00:00", "23/05/2564 00:00:00"})
            .Rows.Add({"Job 2", "01/06/2564 00:00:00", "01/05/2564 00:00:00"})
      End With
      Timer1.Interval = 1000
      Timer1.Enabled = True
    End Sub

    Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
      For row As Integer = 0 To DataGridView1.Rows.Count - 1
            Dim StartDate As Date = DataGridView1.Rows(row).Cells(1).Value
            Dim EndDate As Date = Date.Now
            Dim TimeSpan As TimeSpan = StartDate.Subtract(EndDate)
            Dim DifDays As Integer = TimeSpan.Days
            Dim DifHr As Integer = TimeSpan.Hours
            Dim DifMin As Integer = TimeSpan.Minutes
            DataGridView1.Rows(row).Cells(2).Value = DifDays & " วัน, " & DifHr & " ชั่วโมง, " & DifMin & " นาที."
      Next
    End Sub

komenservice โพสต์ 2021-5-3 08:36:23

thongkorn ตอบกลับเมื่อ 2021-5-2 11:38
ตอบให้เป็นโค้ดแบบเต็มๆเลยดีกว่าครับ Add DataGridView1 และ Timer1 เข้าไปในฟอร์ม ...

ขอบพระคุณครับ อาจารย์
เพิ่มเติมอีกนิดนึงครับ อาจารย์
คือผมต้องการทุกๆครับที่ผม Add Row เข้าไปใน DataGrid แล้วค่อยนับถอยหลังครับ
ตัวอย่างที่อาจารย์ให้มา มันนับถอยหลังพร้อมๆ กันครับ
ขอบพระคุณอาจารย์มากๆเลยครับ ที่เป็นแนวทางให้ผม

thongkorn โพสต์ 2021-5-3 12:41:57

ผมก็นึกว่าดึงมาจากฐานข้อมูลก่อนครับ ... เพิ่ม Control เข้าไปดังนี้ ...
TextBox = txtProjectName
DateTimePicker = dtpDeadline
Button = btnAddRow
Button = btnRemoveRow
Public Class frmCountDownGrid

    Private Sub frmCountDownGrid_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
      With DataGridView1
            '// Autosize Column
            .AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill
            .AllowUserToAddRows = False
            .SelectionMode = DataGridViewSelectionMode.FullRowSelect
      End With
      With DataGridView1
            .ColumnCount = 3
            .Columns(0).Name = "Project Name"
            .Columns(1).Name = "Deadline"
            .Columns(2).Name = "Countdown"
            '.Rows.Add({"Project 1", "23/05/2564 00:00:00", ""})
            '.Rows.Add({"Project 2", "01/06/2565 00:00:00", ""})
      End With
      Timer1.Interval = 1000
      Timer1.Enabled = True
      '//
      txtProjectName.Clear()
      dtpDeadline.Format = DateTimePickerFormat.Custom
      dtpDeadline.CustomFormat = "dd MMMM yyyy hh:mm"
      dtpDeadline.Value = Now()
    End Sub

    Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
      For row As Integer = 0 To DataGridView1.Rows.Count - 1
            Dim StartDate As Date = DataGridView1.Rows(row).Cells(1).Value
            Dim EndDate As Date = Date.Now
            Dim TimeSpan As TimeSpan = StartDate.Subtract(EndDate)
            Dim DifDays As Integer = TimeSpan.Days
            Dim DifHr As Integer = TimeSpan.Hours
            Dim DifMin As Integer = TimeSpan.Minutes
            DataGridView1.Rows(row).Cells(2).Value = DifDays & " วัน, " & DifHr & " ชั่วโมง, " & DifMin & " นาที."
      Next
    End Sub

    Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles btnAddRow.Click
      If txtProjectName.Text.Trim.Length = 0 Then
            MessageBox.Show("กรุณาป้อนชื่อโปรเจค")
            txtProjectName.Focus()
            Exit Sub
      End If
      Call AddRow()
    End Sub

    Private Sub AddRow()
      Dim row As String()
      row = New String() {txtProjectName.Text, dtpDeadline.Value}
      DataGridView1.Rows.Add(row)
      '//
      txtProjectName.Clear()
      dtpDeadline.Value = Now()
      txtProjectName.Focus()
    End Sub

    Private Sub RemoveRow()
      '// Delete current row from DataGridView1
      If DataGridView1.RowCount = 0 Then Exit Sub
      DataGridView1.Rows.Remove(DataGridView1.CurrentRow)
    End Sub

    Private Sub btnRemove_Click(sender As System.Object, e As System.EventArgs) Handles btnRemoveRow.Click
      Call RemoveRow()
    End Sub
End Class

komenservice โพสต์ 2021-5-4 08:21:06

แก้ไขครั้งสุดท้ายโดย komenservice เมื่อ 2021-5-4 09:11

thongkorn ตอบกลับเมื่อ 2021-5-3 12:41
ผมก็นึกว่าดึงมาจากฐานข้อมูลก่อนครับ ... เพิ่ม Control เข้ ...
ขอบพระคุณอาจารย์มากๆเลยครับ ผมได้นำไปประยุกต์ ได้เยอะเลยครับอาจารย์


แต่เวลามันไม่หยุดครับ อิอิ


มันติดลบไปเรื่อยๆครับ

thongkorn โพสต์ 2021-5-4 10:42:37

จากของเดิมหลัก Deadline ในตารางกริด มันเป็นวันที่-เวลาคงที่ หลัก Countdown มันเป็นการนับถอยหลังลง ซึ่งจะยากในการสร้างเงื่อนไข หรือเสียเวลาหาคำสั่งมาทดสอบ 2 หลักนี้ ดังนั้นเราจะใช้หลักการขั้นพื้นฐานพอครับ โดย
- เพิ่มอีก 1 หลัก (CompareTime) แต่หลักนี้จะต้องถูกซ่อนเอาไว้ (Visible = False) โดยเราจะเก็บค่าเวลาปัจจุบันในหลักนี้ ให้เพิ่มค่าขึ้นทุก 1 วินาที
- และแต่ละวินาทีนั้น ก็จะนำค่าในหลัก CompareTime ไปเปรียบเทียบกับหลัก Deadline หากมีค่าเท่ากันเมื่อไหร่ก็จะหยุดการนับถอยหลังทันที จะได้ไม่ติดลบเวลาครับ ... ง่ายมั้ยครับ

Public Class frmCountDownGrid

    Private Sub frmCountDownGrid_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
      With DataGridView1
            '// Autosize Column
            .AutoSizeColumnsMode = DataGridViewAutoSizeColumnsMode.Fill
            .AllowUserToAddRows = False
            .SelectionMode = DataGridViewSelectionMode.FullRowSelect
      End With
      With DataGridView1
            .ColumnCount = 4
            .Columns(0).Name = "Project Name"
            .Columns(1).Name = "Deadline"
            .Columns(2).Name = "Countdown"
            .Columns(3).Name = "CompareTime"    '// หลักเปรียบเทียบเวลา โดยเวลาจะเดินหน้าไปทุก 1 วินาที จนกว่าจะเท่ากับ Deadline ก็จะหยุดการทำงาน
            .Columns(3).Visible = True 'False   '// ปกติต้องซ่อนการมองเห็นด้วย False
      End With
      Timer1.Interval = 1000
      Timer1.Enabled = True
      '//
      txtProjectName.Clear()
      dtpDeadline.Format = DateTimePickerFormat.Custom
      dtpDeadline.CustomFormat = "dd MMMM yyyy hh:mm:ss"
      dtpDeadline.Value = Now()
    End Sub

    Private Sub Timer1_Tick(sender As System.Object, e As System.EventArgs) Handles Timer1.Tick
      For row As Integer = 0 To DataGridView1.Rows.Count - 1
            Dim StartDate As Date = DataGridView1.Rows(row).Cells(1).Value
            Dim EndDate As Date = Date.Now
            Dim TimeSpan As TimeSpan = StartDate.Subtract(EndDate)
            Dim DifDays As Integer = TimeSpan.Days
            Dim DifHr As Integer = TimeSpan.Hours
            Dim DifMin As Integer = TimeSpan.Minutes
            '// เปรียบเทียบเวลา Deadline กับเวลาปัจจุบันที่จะเดินหน้าทุกวินาทีในแต่ละแถว
            '// หากยังมีค่าไม่เท่ากัน ก็นับถอยหลังลงไปเรื่อยๆ จนกว่าจะเป็น 0 ก็จะหยุด
            If DataGridView1.Rows(row).Cells(1).Value <> DataGridView1.Rows(row).Cells(3).Value Then
                '// หลัก CompareTime เวลาจะเดินหน้าไปทุกวินาที จนกว่าจะเท่ากับ Dealline ก็จะหยุดทันที
                DataGridView1.Rows(row).Cells(3).Value = Format(Now, "dd/MM/yyyy hh:mm:ss")
                '// ถอยหลังเวลาลงไปเรื่อยๆ
                DataGridView1.Rows(row).Cells(2).Value = DifDays & " วัน, " & DifHr & " ชั่วโมง, " & DifMin & " นาที."
            End If
      Next
    End Sub

    Private Sub btnAddRow_Click(sender As System.Object, e As System.EventArgs) Handles btnAddRow.Click
      If txtProjectName.Text.Trim.Length = 0 Then
            MessageBox.Show("กรุณาป้อนชื่อโปรเจค")
            txtProjectName.Focus()
            Exit Sub
      End If
      Call AddRow()
    End Sub

    Private Sub AddRow()
      Dim row As String()
      row = New String() {txtProjectName.Text, dtpDeadline.Value, "", Now()}
      DataGridView1.Rows.Add(row)
      '//
      txtProjectName.Clear()
      dtpDeadline.Value = Now()
      txtProjectName.Focus()
    End Sub

    Private Sub RemoveRow()
      '// Delete current row from DataGridView1
      If DataGridView1.RowCount = 0 Then Exit Sub
      DataGridView1.Rows.Remove(DataGridView1.CurrentRow)
    End Sub

    Private Sub btnRemoveRow_Click(sender As System.Object, e As System.EventArgs) Handles btnRemoveRow.Click
      Call RemoveRow()
    End Sub
End Class

komenservice โพสต์ 2021-5-4 23:38:26

thongkorn ตอบกลับเมื่อ 2021-5-4 10:42
จากของเดิมหลัก Deadline ในตารางกริด มันเป็นวันที่-เวลาคง ...

ขอบพระคุณครับ อาจารย์
ทำตามโค๊ดของอาจารย์ ได้แล้วครับ Countdown หยุดที่ 0 นาที 0 วินาที แล้วครับ
ผมเอาไปปรับแต่งความสวยงามนิดหน่อยครับ
ขอบพระคุณอาจารย์ อีกครังครับ

thongkorn โพสต์ 2021-5-7 10:29:57

komenservice ตอบกลับเมื่อ 2021-5-4 23:38
ขอบพระคุณครับ อาจารย์
ทำตามโค๊ดของอาจารย์ ได้แล้วค ...
http://www.g2gnet.com/webboard/images/vbnet/countdowndatagrid.png
ลองเอาโค้ดไปศึกษาดูครับ ...

ดูในรูปแบบกติ: ขอวิธีสร้าง countdown ใน datagridview แต่ละ Rows หน่อยครับ