Học qua các ví dụ: Ví dụ số 04 Counter

tuhocvba · 22/9/19

Mục đích: Mỗi lần ấn vào nút bấm thì chúng ta tăng/giảm hoặc reset count trên Tab Sample.

Bạn cần đăng nhập để thấy đính kèm

1. Tạo file excel 0921.xlsm và đóng lại.
2. Trên phần mềm UI dán đoạn code XML sau:

XML:

<customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui" onLoad="OnLoad">
  <ribbon startFromScratch="false">
    <tabs>
      <tab id="SampleTab" label="Sample" keytip="S" insertBeforeMso="TabHome">
        <group id="CounterGroup1" label="Counter" keytip="C">
          <box id="CounterBox" boxStyle="horizontal">
            <labelControl id="CounterLabel" getLabel="GetCounterLabel"></labelControl>
            <box id="CounterButtonBox" boxStyle="vertical">
              <button id="UpButton" label=" Up  " keytip="U" size="normal" onAction="Button_Click" />
              <button id="DownButton" label="Down" keytip="D" size="normal" onAction="Button_Click" />
              <button id="ResetButton" label="Reset" keytip="R" size="normal" onAction="Button_Click" />
            </box>
          </box>
        </group>
      </tab>
    </tabs>
  </ribbon>
</customUI>

Thuộc tính onLoad trên dòng code số 1 sẽ thiết định thay đổi biến số IRibbonUI thông qua thủ thục trên VBA.

Thuộc tính insertBeforeMso trên dòng code số 4 là để chèn thêm Tab mới vào trước Tab Home.
Tương tự ta cũng có thuộc tính insertAfterMso, nó sẽ chèn vào phía sau.
Thẻ Home có idMso là TabHome.

Thẻ Box có thuộc tính boxStyle trên dòng code số 6. Thuộc tính này ta thiết định giá trị là horizontal nghĩa là các thành phần của Box sẽ được sắp xếp theo hàng ngang.
Nếu ta để giá trị là vertical thì các thành phần của Box sẽ được sắp xếp theo hàng dọc.

Thuộc tính getLabel trên dòng code số 7 sẽ làm thay đổi Label thông qua việc chỉ định gán giá trị thuộc tính với tên thủ tục để thực hiện điều này.
Ở đây, ta có ba nút bấm ứng với các dòng code số 9,10,11. Thuộc tính onAction của chúng đều có tên là Button_Click nhưng thủ tục thực hiện khi nút bấm được ấn thì có thể khác nhau. Nếu xử lý không nhiều, thì ta có thể sử dụng thủ tục dùng chung. Việc xử lý bên trong ứng với từng trường hợp ta sẽ phân tách xử lý thông qua control.ID .

3. Bạn ấn vào Callbacks trên phần mềm UI bạn sẽ thấy cấu trúc code như sau, tôi sẽ thuyết minh sau.

Mã:

'Callback for customUI.onLoad
Sub OnLoad(ribbon As IRibbonUI)
End Sub

'Callback for CounterLabel getLabel
Sub GetCounterLabel(control As IRibbonControl, ByRef returnedVal)
End Sub

'Callback for UpButton onAction
Sub Button_Click(control As IRibbonControl)
End Sub

Tạm thời ta chưa quan tâm, hãy ấn Save trên phần mềm UI.
4. Trên VBE, hãy dán đoạn code dưới đây:

Mã:

Option Explicit

Private myRibbon As IRibbonUI ' Ribbon
Private Count As Long ' Số đếm
Private CountText As String ' Nhãn hiển thị thành tích đếm được

'Callback for customUI.onLoad
Sub OnLoad(ribbon As IRibbonUI) ' Khởi tạo giá trị ban đầu cho Ribbon
  Count = 0
  CountText = "Count = 0"
  Set myRibbon = ribbon ' Để refresh ribbon, ta sẽ thiết định ribbon lại từ đầu

  If CInt(Application.Version) > 12 Then
    myRibbon.ActivateTab ("SampleTab") ' Office 2010 trở đi, chọn vào thẻ [Sample]
  Else
    SendKeys "%s{ENTER}" ' Office 2007, chọn vào thẻ [Sample]
  End If

  myRibbon.Invalidate ' Làm mới hiển thị của ribbon
End Sub

'Callback for CounterLabel getLabel
Sub GetCounterLabel(control As IRibbonControl, ByRef returnedVal)
  returnedVal = CountText ' Cập nhật làm mới chữ trên label hiển thị lại
End Sub

'Callback for Button onAction
Sub Button_Click(control As IRibbonControl)
  Select Case control.ID ' Hàm này sử dụng cho nhiều nút bấm, vì vậy xử lý của hàm sẽ phân tách theo ID
    Case Is = "UpButton"
      Count = Count + 1
    Case Is = "DownButton"
      Count = Count - 1
    Case Is = "ResetButton"
      Count = 0
  End Select

  CountText = "Count = " & CStr(Count)
  myRibbon.Invalidate ' Làm mới hiển thị của ribbon
  ' myRibbon.InvalidateControl ("CounterLabel") ' Chỉ làm mới hiển thị cho ribbon được chỉ định（id="CounterLabel" nên ta chỉ làm mới hiển thị của đối tượng này）
End Sub

5. Sau khi save file 0921.xlsm thì đóng phần mềm UI.
Xem thêm video hướng dẫn:

Bạn cần đăng nhập để thấy đa phương tiện

Thuyết minh về mối liên quan giữa XML và Code Module:

Bạn cần đăng nhập để thấy đính kèm

Nguồn tham khảo:

Bạn cần đăng nhập để thấy link

Euler · 18/4/20

Trường hợp bạn muốn chèn them hình ảnh như hình dưới đây:

Bạn cần đăng nhập để thấy đính kèm

thì cần sửa lại code XML:

XML:

<?xml version="1.0" encoding="utf-8"?>
<customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui" onLoad="OnLoad">
  <ribbon startFromScratch="false">
    <tabs>
      <tab id="SampleTab" label="Sample" keytip="S" insertBeforeMso="TabHome">
        <group id="CounterGroup1" label="Counter" keytip="C">
          <box id="CounterBox" boxStyle="horizontal">
            <labelControl id="CounterLabel" getLabel="GetCounterLabel" />
            <box id="CounterButtonBox" boxStyle="vertical">
              <button id="UpButton" label=" Up  " keytip="U" size="normal"  image="Plus" onAction="Button_Click" />
              <button id="DownButton" label="Down" keytip="D" size="normal"  image="Minus" onAction="Button_Click" />
              <button id="ResetButton" label="Reset" keytip="R" size="normal"  image="Reset" onAction="Button_Click" />
            </box>
          </box>
        </group>
      </tab>
    </tabs>
  </ribbon>
</customUI>

Tên các bức ảnh được sử dụng là Plus.jpg, Minus.jpg, Reset.jpg, tuy nhiên khi viết trong code XML, các bạn bỏ phần mở rộng của file ảnh đi, chỉ cần ghi tên là được.
File ảnh như các bài học trước đã nói, kích thước nên là 16x16 hoặc 32x32.
Nguồn:

Bạn cần đăng nhập để thấy link

Học qua các ví dụ: Ví dụ số 04 Counter

tuhocvba

Administrator

Euler

Administrator