カレンダーに改ページ機能を追加

普通では、カレンダーには現在の月の日付しか表示されていません。本マニュアルでは、ページをめくる効果と日付の選択機能について紹介します。

テンプレートパラメータと対応する日付コントロールを設定し、ハイパーリンクでイベントをクリックしてコントロール値を変更し、直接クエリし、ページをめくる効果を実現します。

1.コンポーネントインストール

ダークカレンダーコンポーネントをダウンロードします。

Dark Calendar.b04ea70e-4847-4d79-bb36-f80e281abd1a.reu.zip

カレンダーコンポーネントのスタイルを次の図に示します。

2.パラメータペインの設計

新しい計器パネルを作成して、パラメータペインでドラッグして、検索ウィジェットと日付ウィジェットを追加します。ウィジェット名を最新に変更し、フォーマットをyyyy-mmに設定します。返品日を確認します。下図のように：

3.カレンダーデザイン

ダウンロードしたカレンダーコンポーネントをダッシュボードにドラッグします。

B2ユニットの数式は$dateで、セルB3は weekday (todate (date (year ($date), month ($date), 1))で、C3 はdaysofmonth ($date)です。

カレンダー本体の日付をすべて選択し、条件付き書式を追加するために右クリックし、青い背景を選択します。そして $$$= day(now()) と month (B2) == month (B1) も追加し、その日の日付を選択すると背景色が青になることを示します。

B15、C15、F15、G15のそれぞれのセルに昨年、先月、来月、来年を書きます。

セルB15を選択し、ハイパーリンクを選択し、JavaScriptスクリプトダイアログを表示します。パラメータaを追加し、パラメータの値タイプをformat (yeardelta (B2, - 1), "yyyy-mm")に変更します。 下図のように：

JS コードは以下の通りです：

_g().parameterEl.getWidgetByName("date").setValue(a); _g().parameterCommit();

他の3つのセルのJSコードは同じで、パラメータAの設定は以下の通りです。

去年: format (yeardelta (B2, - 1), "yyyy-mm")

前月: format (monthdelta (B2, - 1), "yyyy-mm")

来月: format (monthdelta (b2,1), "yyyy mm")

来年: format (yeardelta (b2,1), "yyyy mm")

注意: Parametereiメソッドは現在サポートされていないので、モバイルエンドで無効です。

保存後、「プレビュー」ボタンをクリックします。効果は以下の通りです。

クリックでダンロップします: calendar.frm