DEV Community

rio lo
rio lo

Posted on • Edited on

A date component development based on ARKTS

Project Overview
This is a card component used to display date information (including Gregorian calendar, lunar calendar, and day of the week), developed based on ArkJS/ArkTS, with modular design, processing date logic through the DateTransfer class, and the DateCard struct is responsible for UI display.

Development steps

  1. Select entry in the empty project, right-click and select Atomic Service (meta service)

448ec1286bee0ea732d97002218a646

  1. Select a template and configure the information
    f7f635a917e09259146a6b2e41d58a6

  2. Add the card page to the pages folder in the detecard directory

img_4

  1. The date data processing module (DateTransfer) is responsible for processing the date logic, using the third-party library cjcalendar to obtain the lunar calendar, and entering ohpm install cjcalendar in the terminal to download the third-party library. To use it, you can create a date data object new DateTransfer() to get real-time date data.  
  2. Adapt the system color theme in the resource file img_5

result

dark mode

7baab3a8672bdcf80d43fabbf4e77b6

light mode

28574d20f2a0884ee78465abbfa90a0

Top comments (1)

Some comments may only be visible to logged-in visitors. Sign in to view all comments.