Xojo 2019 で control set を作ってコントロールを配列で扱うようにする方法と注意点

コントロールを並べる時に、配列で扱う方法についての備忘録。

環境

• Windows 10 Pro
• Xojo 2019 Release 3.2
• Desktop アプリと Web アプリで検証

なお、最近の Xojo は以下のようにおこなうようです。
https://blog.xojo.com/2022/01/21/simplified-adding-user-interface-controls-at-runtime/

作り方

TextField の配列を作る場合を例にして説明します。

「TextFieldテスト」という名前のTextFieldを作ります。

TextField を必要なだけ並べます。

2つ目の TextField の名前を1つ目と同じ「TextFieldテスト」にすると、「control set」にするかどうか聞いてくるので「OK」を押します。

3つ目以降も同様にして、「TextFieldテスト(0)」〜「TextFieldテスト(4)」を作成します。

使い方

Desktop アプリ

ここでは PushButton を押す Action で control set を扱ってみます。

PushButton の Action に、以下を記述します。

var i as integer = 0
while TextFieldテスト(i)<>nil
  TextFieldテスト(i).Value =i.ToString
  i=i+1
wend

ボタンを押すと、ControlSet でアクセスした TextField に値が入ります。

Webアプリ

ほぼ同じです。

var i as integer = 0
while TextFieldテスト(i)<>nil
  TextFieldテスト(i).Text =i.ToString
  i=i+1
wend

注意点

• この記事では「配列」として扱っているが、本当の配列ではないらしい
• なので配列の UBound や ListCount などを得ることはできない

先のサンプルコードでは For ~ Next の係数を決め打ちで回していたが、配列上限をチェックするには以下のようにする

var i as integer = 0
while TextFieldテスト(i)<>nil
  TextFieldテスト(i).Value =i.ToString
  i=i+1
wend

Controlを増やす

デスクトップ

Var newTF,newTF2 As TextField
var Count as integer = 0

while TextFieldテスト(Count)<>nil
  Count=Count+1
wend

newTF = New TextFieldテスト

newTF.Top = TextFieldテスト(Count-1).Top + 34
newTF.Left = TextFieldテスト(Count-1).Left
newTF.Width = TextFieldテスト(Count-1).Width
newTF.Height = TextFieldテスト(Count-1).Height
newTF.Visible = TextFieldテスト(Count-1).Visible

プロパティを丸々コピーするのは以下にヒントがありますがうまくいかず、上のようにひとつひとつ設定しました。

Web

以下のようにしてみたが、うまくいきません。

https://blog.xojo.com/2022/01/21/simplified-adding-user-interface-controls-at-runtime/

Sub Action()
  Var newTF As WebTextField
  var Count as integer = 0
  
  while TextFieldテスト(Count)<>nil
    Count=Count+1
  wend
  
  newTF = New TextFieldテスト
  
  newTF.Top = TextFieldテスト(Count-1).Top + 34
  newTF.Left = TextFieldテスト(Count-1).Left
  newTF.Width = TextFieldテスト(Count-1).Width
  newTF.Height = TextFieldテスト(Count-1).Height
  newTF.Visible = TextFieldテスト(Count-1).Visible
End Sub

どうやら Web1.0 では、コントロールをダイナミックに増減するには WebContainer を使う必要があるようです。

Web1.0 でコントロールをダイナミックに増減するには

実用的には、十分な数のコントロールを配列にセットしておき、 Visible を True/False に操作するのが良さそう。