layout.formLayout do not handle canvas.Text well in second column

[chran554]

Checklist

• I have searched the issue tracker for open issues that relate to the same problem, before opening a new one.
• This issue only relates to a single bug. I will open new issues for any other problems.

Describe the bug

The form layout do not handle canvas.Text in the second column very well.
The texts at each line in first column do not align vertically with matching texts in second column.

How to reproduce

Create a formlayout with canvas.Text's in both columns.

Screenshots

Example code

	form := container.New(layout.NewFormLayout(),
		canvas.NewText("label1", color.White), canvas.NewText("value1", color.White),
		canvas.NewText("label2", color.White), canvas.NewText("value2", color.White),
		canvas.NewText("label3", color.White), canvas.NewText("value3", color.White),
	)
	window.SetContent(form)

Fyne version

2.4.4

Go compiler version

1.21.3

Operating system and version

macOS Sonoma 14.2.1

Additional Information

A hint to a solution and where the problem might lie.
This is a fix I've used in my own project.
The solution for rendering second column is merely trying to mirror the special case handling of canvas.Text in first column.

DO NOTE: The solution is not verified or tested but within my own code with acceptable visual result.

File: formlayout.go

func (f *formLayout) Layout(objects []fyne.CanvasObject, size fyne.Size) {
  // [...]

		tableRow := table[row]
		if _, ok := objects[i].(*canvas.Text); ok {
			objects[i].Move(fyne.NewPos(innerPadding, y+innerPadding))
			objects[i].Resize(fyne.NewSize(tableRow[0].Width-innerPadding*2, objects[i].MinSize().Height))
		} else {
			objects[i].Move(fyne.NewPos(0, y))
			objects[i].Resize(fyne.NewSize(tableRow[0].Width, tableRow[0].Height))
		}

		if i+1 < len(objects) {
                         // Here is the fix with special case for canvas.Text in second column as well
			if _, ok := objects[i+1].(*canvas.Text); ok { 
				objects[i+1].Move(fyne.NewPos(padding+tableRow[0].Width+innerPadding, y+innerPadding))
				objects[i+1].Resize(fyne.NewSize(tableRow[1].Width-innerPadding*2, objects[i+1].MinSize().Height))
			} else {
				objects[i+1].Move(fyne.NewPos(padding+tableRow[0].Width, y))
				objects[i+1].Resize(fyne.NewSize(tableRow[1].Width, tableRow[0].Height))
			}
		}

  // [...]
}

[andydotxyz]

I don't think this is the fault of a layout. The "canvas.Text" is a draw primitive - it has no awareness of standard widget sizes etc. using a "Label" in this place would align perfectly.
The layout is correctly asking the item to fill that space and the text responds by putting it at the top left.
This sort of misalignment can happen if you mix canvas primitives and widgets - they serve different purposes.

[andydotxyz]

I think the special case code in first column was because a form expects the left will normally be text... so it is simulating a theme label for you. Maybe that is the bug?

[chran554]

I did not see the possibility to use text in the formlayout as a bug.
Bug or not, I liked the possibility to use text instead of labels because it can give you a very condensed layout that way without the spacing between labels.

If you offer the use of text in the first column I rather thought it would be consistent if you could use text in the second column as well.

[andydotxyz]

I did not see the possibility to use text in the formlayout as a bug.

Yes, but the thing that causes the bug is our special handling of text on the left, not adding more special handling on the right? If you are using it for condensed usage but we add the code in you suggest then won't it behave exactly like a label and the condensed usage will be taken away?

[chran554]

Yes, but the thing that causes the bug is our special handling of text on the left, not adding more special handling on the right?

Yes, correct

If you are using it for condensed usage but we add the code in you suggest then won't it behave exactly like a label and the condensed usage will be taken away?

I think the effect of condensed text (rows) is still there as you can see on the first three rows in the screenshot attached.

An example of mixed labels and text in the "altered"/fixed formLayout (textformlayout.go).

form := container.New(l.NewTextFormLayout(),
	canvas.NewText("text 1", colornames.Yellow), canvas.NewText("text 4", colornames.Yellow),
	canvas.NewText("text 2", colornames.Yellow), canvas.NewText("text 5", colornames.Yellow),
	canvas.NewText("text 3", colornames.Yellow), canvas.NewText("text 6", colornames.Yellow),

	widget.NewLabel("label 1"), canvas.NewText("text 7", colornames.Green),
	widget.NewLabel("label 2"), canvas.NewText("text 8", colornames.Green),
	widget.NewLabel("label 3"), canvas.NewText("text 9", colornames.Green),

	canvas.NewText("text 10", colornames.Orange), widget.NewLabel("label 4"),
	canvas.NewText("text 11", colornames.Orange), widget.NewLabel("label 5"),
	canvas.NewText("text 12", colornames.Orange), widget.NewLabel("label 6"),

	widget.NewLabel("label 7"), widget.NewLabel("label 10"),
	widget.NewLabel("label 8"), widget.NewLabel("label 11"),
	widget.NewLabel("label 9"), widget.NewLabel("label 12"),
)

window.SetContent(form)