ディーバ Blog

大阪発 C#の会社、株式会社ディーバの Blog です。

Xamarin.iOS SfDataGrid でセルの背景色を変える

Syncfusion SfDataGrid でセルの背景色を変える方法です。

※ この記事の投稿時点の SfDataGrid のバージョンは v15.2.0.46 です。

f:id:jz5_diva:20170722013749p:plain

セルの背景色の変更は GridCell クラスを継承したクラスを GridColumn クラス UserCellType プロパティに指定します。背景色以外も自由にカスタマイズできます。

ちなみに、行全体の背景色を変えるには DataGridStyle クラスが使えます(Styles 参照)。

次のようにユーザー定義のセルを作ります。

public class ColoredCell : GridCell
{
    UILabel _label;

    public ColoredCell()
    {
        _label = new UILabel
        {
            Font = UIFont.SystemFontOfSize(20)
        };
        Add(_label);
        CanRenderUnLoad = false;
    }

    protected override void UnLoad()
    {
        RemoveFromSuperview();
    }

    public override void Draw(CGRect rect)
    {
        _label.Font = DataColumn.GridColumn.RecordFont;
        _label.TextColor = DataColumn.Renderer.DataGrid.GridStyle.GetRecordForegroundColor();
        _label.TextAlignment = UITextAlignment.Center;
        base.Draw(rect);
    }

    public override void LayoutSubviews()
    {
        base.LayoutSubviews();

        var valueText = DataColumn.CellValue.ToString();

        _label.Frame = new CGRect(0, Bounds.Top, Bounds.Width, Bounds.Height);
        _label.Font = DataColumn.GridColumn.RecordFont;
        _label.TextAlignment = UITextAlignment.Center;
        _label.Text = valueText;

        // セルの値が true のとき背景色を変える
        if (bool.TryParse(valueText, out var result) && result)
        {
            _label.BackgroundColor = UIColor.Orange;
        }
    }

    protected override void Dispose(bool disposing)
    {
        if (_label != null)
        {
            _label.Dispose();
            _label = null;
        }

        base.Dispose(disposing);
    }
}

GridColumn.UserCellType に設定します。

var col = new GridTextColumn {
    // ...
};
col.UserCellType = typeof(ColoredCell);
_dataGrid.Columns.Add(col);