Xamarin.Forms で Nuget のカレンダーを使う(1)

More than 1 year has passed since last update.

初投稿です。Xamarin.Forms を使って何でもいいからスマフォアプリが作りたくて勉強中。


今回やりたいこと

Xamarin.Forms でカレンダーの表示・利用。

ただ Android の CalendarView みたいなものがないので、どうすればいいのか…と思案。調べてもなかなか出てきません。各ネイティブ層で別々に作るか、それらしいのを自力で作るしかないのかと思ったところで、Nuget に有志が作ってくれたパッケージがあることを知り、それを試してみることにしました。

Android/iPhone 両方で作りたいのですが、今は iMac 環境が無いのでとりあえず Android 環境でのみ確認しておきます。

使うのは Nuget にあった XamForms.Controls.Calendar です。


環境


  • Visual Studio 2017 v15.5.5

  • .NET Framework 4.7

  • Xamarin.Forms 2.5

  • Android Emulator x86 (v6.0 API23)


事前準備


  1. [ツール]->[ソリューションのパッケージの管理] を開く

  2. 今回は XamForms.Controls.Calendar v1.1.1 を選択
    xamarin_nuget_calendar.png

  3. 「インストール」ボタンを押下してインストール


基本表示

カレンダーを貼り付けたい XAML の ContextPage に以下文を追加します。


Sample.xaml

xmlns:controls="clr-namespace:XamForms.Controls;assembly=XamForms.Controls.Calendar"



  1. カレンダーを貼り付けたい XAML に以下文を追加


Sample.xaml

            <controls:Calendar Padding="10,0,10,0" StartDay="Sunday" 

SelectedBorderWidth="4" DisabledBorderColor="Black" />

cs ソースは変更なし。

単純にカレンダーを表示させるだけならこれで OK です。

xamarin_calendar_def.png


属性

XamForms.Controls.Calendar は結構属性が多いです。

以下は一例。どっかに API ないのかしら…

属性
概要
指定文字

TitleLabelTextColor
年月表示の色を指定する

TitleLabelFormat
年月表示のフォーマットを指定する
e.g.) "YYYY年 MM月"

StartDay
開始曜日の指定
曜日

SelectedBorderWidth
選択した日の枠の太さ
数字

Padding
前後左右の余白
左幅,上幅,右幅,下幅,

DatesTextColor
年月に該当する日々の色を指定する

取り合えずデフォルトでは 2 2018 みたいな感じでダサいので、 TitleLabelFormat 属性でいいフォーマットにしておいたほうが良さそうです。


Sample4.xaml

            <controls:Calendar Padding="10,0,10,0" StartDay="Sunday" 

SelectedBorderWidth="4" DisabledBorderColor="Black"
TitleLabelFormat="yyyy年MM月" />


画面遷移と土日祝日の設定

続きを書きました。

Xamarin.Forms で Nuget のカレンダーを使う(2)


リンク

基本的な使い方は本家参照。

https://github.com/rebeccaXam/XamForms.Controls.Calendar