DFL: 表を描画するサンプルコード
作図機能を担うdfl.chartモジュールをDFLに追加しました。
まだ、表を描画するTableRendererクラスしかありませんが、 今後は、線グラフ(LineGraphRenderer)や、印刷モジュールdfl.printingを書くそもそもの目的であった タイムチャート(TimeChartRenderer)を作図する機能を追加したいです。
デフォルト設定で描いた表
描画するレコード番号を指定するfirstRecordとlastRecordだけは、必ず設定する必要があります。 そうしないと、何も表示されません。
それ以外をデフォルト設定で描いたものが次の表です。
- ヘッダーがないCSVとして読み込み(すべてレコード)
- 罫線なし
設定変更して書いた表
表の見た目は、色々と変更することができます。
本記事冒頭の画像は、次のコードのとおり、見た目を設定した表になっています。
- 行の高さを変更
- 列の幅を変更
- 文字の左と上のパディングを変更
- 表の左と上のマージンを変更
- ヘッダーがあるCSVとして読み込み
- ヘッダーを表示
- レコード番号0から3までを表示
- 文字色を黒に
- 背景色を白に
- 罫線色を明るい灰色に
- ヘッダーの下に罫線あり
- 表の上下左右に罫線有り
- レコードとレコードの間に罫線あり
- カラムとカラムの間に罫線あり
- ヘッダーのフォントを変更
- レコードのフォントを変更
import dfl; version(Have_dfl) // For DUB. { } else { pragma(lib, "dfl.lib"); } class MainForm : Form { alias CustomTableRenderer = TableRenderer!(string, string, string); CustomTableRenderer _table; public this() { this.text = "TableRenderer example"; this.size = Size(450, 450); string csv = "ID,Name,Value\n" ~ "1,Kyoto,100\n" ~ "2,Osaka,50\n" ~ "3,Tokyo,20\n" ~ "4,Aomori,10\n"; _table = new CustomTableRenderer(csv); _table.height = 40; _table.width[0] = 50; _table.width[1] = 80; _table.width[2] = 150; _table.paddingX = 10; _table.paddingY = 12; _table.margin = Point(20, 20); _table.hasHeader = true; // true : 1st line is header. _table.showHeader = true; _table.firstRecord = 0; _table.lastRecord = 3; _table.textColor = Color.black; _table.backColor = Color.white; _table.lineColor = Color.lightGray; _table.headerLine = true; _table.topSideLine = true; _table.leftSideLine = true; _table.bottomSideLine = true; _table.rightSideLine = true; _table.verticalLine = true; _table.horizontalLine = true; _table.headerFont = new Font("MS Gothic", 16f, FontStyle.BOLD); _table.recordFont = new Font("MS Gothic", 12f, FontStyle.REGULAR); } protected override void onPaint(PaintEventArgs e) { if (_table) _table.draw(e.graphics); } } static this() { Application.enableVisualStyles(); } void main() { Application.run(new MainForm()); }
今後の課題
- [済] 幅が狭くて文字が長いときに文字がセルからはみ出すので、折返し処理とクリッピング処理を選択できるようにする。