How-to Auto Resize core.Body to fit Contents ?

[heejit]

I have a dialog as follow I want core.Body to auto resize to fit it contents ->

[kkoreilly]

Are you saying that you want the dialog to be smaller by default than it is in that screenshot (such that it is only as big as its contents)? If so, we could potentially do that.

[heejit]

You are right dialog is correct size actually TextField is bigger than then buttons width

1. So I need textfield to equal size of buttons width (total width of 3 buttons).

2. Textfield also growing vertically as we type I don't want that instead if contents is bigger than
   textfield width it should scroll horizontally.

[heejit]

s.SetTextWrap(false) solved the 2nd issue.

[kkoreilly]

You could try doing this with your text field to make it have the same size as the surrounding content/buttons:

s.Min.X.Zero()
s.Max.X.Zero()

[heejit]

It has no affect.

[heejit]

Here is the full code ->

func AskNumberOSK(pCtx core.Widget,  pMsg string, pAllowInput bool, pIsPassword bool, okFunc func(string)) {
	vBody := core.NewBody("")
	vBody.Styler(func (s *styles.Style) {
		s.Display   = styles.Flex
		s.Direction = styles.Column
	})

	core.NewText(vBody).SetType(core.TextHeadlineSmall).SetText(pMsg)

	vInput := core.NewTextField(vBody)
	if pIsPassword == true {
		vInput.SetTypePassword()
	}
	vInput.SetType(core.TextFieldOutlined)

	vInput.Styler(func (s *styles.Style) {
		s.Min.X.Zero()
		s.Max.X.Zero()
		s.SetTextWrap(false) // do not increase height
		s.SetMono(true)
		s.Font.Size.Dp(30)
		if pAllowInput == true {
			s.SetReadOnly(false)
		} else {
			s.SetReadOnly(true)
		}
	})

	vFrame1 := core.NewFrame(vBody)
	vFrame1.Styler(func (s *styles.Style) {
		s.Display = styles.Grid
		s.Columns = 3
	})

	for _, vStr := range strings.Split("0,1,2,3,4,5,6,7,8,9,B,E", ",") {
		vButton := core.NewButton(vFrame1)
		vStr = strings.TrimSpace(vStr)
		vButton.SetText(vStr)

		vButton.Styler(func (s *styles.Style) {
			s.SetMono(true)
			s.SetNonSelectable()
			s.Border.Radius = styles.BorderRadiusSmall
		})

		// button font size change required following
		tree.AddChildInit(vButton, "text", func(w *core.Text) {
			w.Styler(func(s *styles.Style) {
				s.Font.Size.Dp(50)
				s.Text.LineHeight.Dp(50)
			})
		})

		vButton.OnClick(func(e events.Event) {
			t := vInput.Text()

			switch vStr {
			case "B":
				if len(t) > 0 {
					t = t[:len(t)-1]
				}

			case "E":
				okFunc(t)
				vBody.Close()

				default:
				t = t + vStr
			}
			vInput.SetText(t)
		})
	}
	vBody.RunDialog(pCtx)
}

[kkoreilly]

I ran your example code, and the issue is not the text field but rather the default minimum dialog size of 400dp that we are setting. Therefore, we will add an option that allows you to disable that default minimum size soon.

[kkoreilly]

@heejit We added an option in #1306 to disable the minimum dialog size, so the dialog should be the correct size if you do this instead of d.RunDialog(ctx):

d.NewDialog(ctx).SetUseMinSize(false).Run()

Please let me know if that resolves the issue.

[heejit]

I have updated like this -> go get cogentcore.org/core@56a2b0c
go: downloading cogentcore.org/core v0.3.6-0.20241115010742-56a2b0cb8513
go: upgraded cogentcore.org/core v0.3.6-0.20241113233327-006fc7bdaf0f => v0.3.6-0.20241115010742-56a2b0cb8513

But no effect

[heejit]

[heejit]

I have updated ->

go get cogentcore.org/core@43c6bd6
go: downloading cogentcore.org/core v0.3.6-0.20241115203139-43c6bd60ac38
go: upgraded cogentcore.org/core v0.3.6-0.20241115010742-56a2b0cb8513 => v0.3.6-0.20241115203139-43c6bd60ac38

still same result.

[kkoreilly]

Are you using this code for running the dialog?

d.NewDialog(ctx).SetUseMinSize(false).Run()

If so, can you please paste the code for the dialog?

[heejit]

Here is the code ->

func AskNumberOSK(pCtx core.Widget,  pMsg string, pAllowInput bool, pIsPassword bool, pOkFunc func(string)) {
	var vBody *core.Body
	var vInput *core.TextField
	var vFrame1 *core.Frame
	var vTextHeading *core.Text

	vBody = core.NewBody("")
	vBody.Styler(func (s *styles.Style) {
		s.Display   = styles.Flex
		s.Direction = styles.Column
	})

	vTextHeading = core.NewText(vBody)
	vTextHeading.SetType(core.TextHeadlineSmall)
	vTextHeading.SetText(pMsg)

	vInput = core.NewTextField(vBody)
	if pIsPassword == true {
		vInput.SetTypePassword()
	}
	vInput.AddClearButton()
	vInput.ContextMenus = nil
	vInput.Scene.ContextMenus = nil
	vInput.Styler(func (s *styles.Style) {
		s.Min.X.Zero()
		s.Max.X.Zero()
		s.SetTextWrap(false) // do not increase height
		s.SetMono(true)
		s.Font.Size.Dp(30)
		if pAllowInput == true {
			s.SetReadOnly(false)
		} else {
			s.SetReadOnly(true)
		}
	})

	vFrame1 = core.NewFrame(vBody)
	vFrame1.Styler(func (s *styles.Style) {
		s.Display = styles.Grid
		s.Columns = 3
	})

	for _, vStr := range strings.Split("0,1,2,3,4,5,6,7,8,9,B,E", ",") {
		vButton := core.NewButton(vFrame1)
		vStr = strings.TrimSpace(vStr)
		vButton.SetText(vStr)

		vButton.Styler(func (s *styles.Style) {
			s.SetMono(true)
			s.SetNonSelectable()
			s.Border.Radius = styles.BorderRadiusSmall
		})

		// button font size change required following
		tree.AddChildInit(vButton, "text", func(w *core.Text) {
			w.Styler(func(s *styles.Style) {
				s.Font.Size.Dp(50)
				s.Text.LineHeight.Dp(50)
			})
		})

		vButton.OnClick(func(e events.Event) {
			t := vInput.Text()

			switch vStr {
			case "B":
				if len(t) > 0 {
					t = t[:len(t)-1]
				}
				vInput.SetText(t)

			case "E":
				pOkFunc(t)
				vBody.Close()

			default:
				t = t + vStr
				vInput.SetText(t)
			}

		})
	}
	//vBody.RunDialog(pCtx)
	vBody.NewDialog(pCtx).SetUseMinSize(false).Run()
}