Help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes
Hello Pharo Users. I am seeking help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes, I am creating a User Settings Class to learn how to use Pharo. I copied some core widgets from the UITheme exampleBasicControls. I would like to know, starting with the code below, how to detect if the User has selected the "Ok" or "Cancel" button in the lower right of the form, and then if the user selects "Ok" how do I detect the state of the widgets (Checkboxes, Radio buttons, or Texteditor), and save those states to instance variables? |dialog builder radioModel treeModel CheckboxA| builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. radioModel := ExampleRadioButtonModel new. treeModel := ValueHolder new contents: TextStyle actualTextStyles explorerContents. dialog contentMorph: ( ( dialog newRow: { dialog newLabelGroup: { 'Normal Label'->(dialog newLabel: 'A Label'). 'Normal Button'->(dialog newButtonFor: nil action: nil label: 'A Button' help: 'This is a button'). 'Default Button'->((dialog newButtonFor: nil action: nil label: 'Default Button' help: 'This is a default button') isDefault: true). 'Selected Button'->(dialog newButtonFor: (ValueHolder new contents: true) getState: #contents action: nil arguments: #() getEnabled: nil label: 'A Button' help: 'This is a selected button'). 'Checkbox A'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox B'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox C'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Radio Buttons'-> ( ( dialog newColumn: { (dialog newRadioButtonFor: radioModel getSelected: #isLeft setSelected: #beLeft label: 'Left' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isCenter setSelected: #beCenter label: 'Center' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isRight setSelected: #beRight label: 'Right' help: 'This is a radio buton') } ) vResizing: #shrinkWrap ). 'Text Entry'->(dialog newTextEntryFor: (ValueHolder new contents: 'Hello') getText: #contents setText: #contents: help: 'This is a text entry'). 'Slider'->(dialog newSliderFor: (ValueHolder new contents: 0.5) getValue: #contents setValue: #contents: help: 'This is a slider'). 'Bump Temp'->(dialog newTextEntryFor: (ValueHolder new contents: '75') getText: #contents setText: #contents: help: 'This is the random shift'). }. dialog newVerticalSeparator. dialog newLabelGroup: { 'Drop List'->(dialog newDropListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four')) list: #list getSelected: #selectionIndex setSelected: #selectionIndex: help: 'This is a drop list'). 'Normal List'-> ( ( dialog newListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four'); selectionIndex: 3) list: #list selected: #selectionIndex changeSelected: #selectionIndex: help: 'This is a list' ) minWidth: 120 ). }. } ) vResizing: #spaceFill ); model: nil. builder openModal: dialog.
I am not sure I would recommend using Builder.. except for playing initially around. It is better to simply use the basic capabilities in Morph and tie it up with TableLayout policy.. Proportional Layout In that you do have a better chance of working these issues out once you get the core behaviors, the API/ methods of each of the morphs. That said many of these morphs are not perfect and will require patience to rip through the attributes you need and save to inst vars et al. Maybe sometime soon I can package a clean MorphicView system that will alleviate this pain of figuring out Morphic.. but its fun once you figure it out.. On Sat, Mar 31, 2012 at 7:44 AM, Nelson Pingitore <pingitorenelson@gmail.com
wrote:
Hello Pharo Users. I am seeking help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes, I am creating a User Settings Class to learn how to use Pharo. I copied some core widgets from the UITheme exampleBasicControls. I would like to know, starting with the code below, how to detect if the User has selected the "Ok" or "Cancel" button in the lower right of the form, and then if the user selects "Ok" how do I detect the state of the widgets (Checkboxes, Radio buttons, or Texteditor), and save those states to instance variables?
|dialog builder radioModel treeModel CheckboxA| builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. radioModel := ExampleRadioButtonModel new. treeModel := ValueHolder new contents: TextStyle actualTextStyles explorerContents. dialog contentMorph: ( ( dialog newRow: { dialog newLabelGroup: { 'Normal Label'->(dialog newLabel: 'A Label'). 'Normal Button'->(dialog newButtonFor: nil action: nil label: 'A Button' help: 'This is a button'). 'Default Button'->((dialog newButtonFor: nil action: nil label: 'Default Button' help: 'This is a default button') isDefault: true). 'Selected Button'->(dialog newButtonFor: (ValueHolder new contents: true) getState: #contents action: nil arguments: #() getEnabled: nil label: 'A Button' help: 'This is a selected button'). 'Checkbox A'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox B'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox C'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Radio Buttons'-> ( ( dialog newColumn: { (dialog newRadioButtonFor: radioModel getSelected: #isLeft setSelected: #beLeft label: 'Left' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isCenter setSelected: #beCenter label: 'Center' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isRight setSelected: #beRight label: 'Right' help: 'This is a radio buton') } ) vResizing: #shrinkWrap ). 'Text Entry'->(dialog newTextEntryFor: (ValueHolder new contents: 'Hello') getText: #contents setText: #contents: help: 'This is a text entry'). 'Slider'->(dialog newSliderFor: (ValueHolder new contents: 0.5) getValue: #contents setValue: #contents: help: 'This is a slider'). 'Bump Temp'->(dialog newTextEntryFor: (ValueHolder new contents: '75') getText: #contents setText: #contents: help: 'This is the random shift'). }. dialog newVerticalSeparator. dialog newLabelGroup: { 'Drop List'->(dialog newDropListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four')) list: #list getSelected: #selectionIndex setSelected: #selectionIndex: help: 'This is a drop list'). 'Normal List'-> ( ( dialog newListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four'); selectionIndex: 3) list: #list selected: #selectionIndex changeSelected: #selectionIndex: help: 'This is a list' ) minWidth: 120 ). }. } ) vResizing: #spaceFill ); model: nil. builder openModal: dialog.
I hope this might help... Simple SUnit tests.. through basic morphic... LayoutTests and MorphicWidgetTests would be nice.. #testModelAndView would be basics of what might help... But they are really the very rudimentary stuff.. Always use Model /controller - presenter along with the View/ UI class. makes it easier.. On Sun, Apr 1, 2012 at 2:54 AM, S Krish <krishnamachari.sudhakar@gmail.com>wrote:
I am not sure I would recommend using Builder.. except for playing initially around.
It is better to simply use the basic capabilities in Morph and tie it up with TableLayout policy.. Proportional Layout
In that you do have a better chance of working these issues out once you get the core behaviors, the API/ methods of each of the morphs. That said many of these morphs are not perfect and will require patience to rip through the attributes you need and save to inst vars et al.
Maybe sometime soon I can package a clean MorphicView system that will alleviate this pain of figuring out Morphic.. but its fun once you figure it out..
On Sat, Mar 31, 2012 at 7:44 AM, Nelson Pingitore < pingitorenelson@gmail.com> wrote:
Hello Pharo Users. I am seeking help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes, I am creating a User Settings Class to learn how to use Pharo. I copied some core widgets from the UITheme exampleBasicControls. I would like to know, starting with the code below, how to detect if the User has selected the "Ok" or "Cancel" button in the lower right of the form, and then if the user selects "Ok" how do I detect the state of the widgets (Checkboxes, Radio buttons, or Texteditor), and save those states to instance variables?
|dialog builder radioModel treeModel CheckboxA| builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. radioModel := ExampleRadioButtonModel new. treeModel := ValueHolder new contents: TextStyle actualTextStyles explorerContents. dialog contentMorph: ( ( dialog newRow: { dialog newLabelGroup: { 'Normal Label'->(dialog newLabel: 'A Label'). 'Normal Button'->(dialog newButtonFor: nil action: nil label: 'A Button' help: 'This is a button'). 'Default Button'->((dialog newButtonFor: nil action: nil label: 'Default Button' help: 'This is a default button') isDefault: true). 'Selected Button'->(dialog newButtonFor: (ValueHolder new contents: true) getState: #contents action: nil arguments: #() getEnabled: nil label: 'A Button' help: 'This is a selected button'). 'Checkbox A'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox B'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox C'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Radio Buttons'-> ( ( dialog newColumn: { (dialog newRadioButtonFor: radioModel getSelected: #isLeft setSelected: #beLeft label: 'Left' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isCenter setSelected: #beCenter label: 'Center' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isRight setSelected: #beRight label: 'Right' help: 'This is a radio buton') } ) vResizing: #shrinkWrap ). 'Text Entry'->(dialog newTextEntryFor: (ValueHolder new contents: 'Hello') getText: #contents setText: #contents: help: 'This is a text entry'). 'Slider'->(dialog newSliderFor: (ValueHolder new contents: 0.5) getValue: #contents setValue: #contents: help: 'This is a slider'). 'Bump Temp'->(dialog newTextEntryFor: (ValueHolder new contents: '75') getText: #contents setText: #contents: help: 'This is the random shift'). }. dialog newVerticalSeparator. dialog newLabelGroup: { 'Drop List'->(dialog newDropListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four')) list: #list getSelected: #selectionIndex setSelected: #selectionIndex: help: 'This is a drop list'). 'Normal List'-> ( ( dialog newListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four'); selectionIndex: 3) list: #list selected: #selectionIndex changeSelected: #selectionIndex: help: 'This is a list' ) minWidth: 120 ). }. } ) vResizing: #spaceFill ); model: nil. builder openModal: dialog.
When I am using a construct such as the following: builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. . . . model: nil. builder openModal: dialog. is there another option other than "openModel", to use to open the dialog? On Sat, Mar 31, 2012 at 5:34 PM, S Krish <krishnamachari.sudhakar@gmail.com>wrote:
I hope this might help...
Simple SUnit tests.. through basic morphic...
LayoutTests and MorphicWidgetTests would be nice.. #testModelAndView would be basics of what might help...
But they are really the very rudimentary stuff.. Always use Model /controller - presenter along with the View/ UI class. makes it easier..
On Sun, Apr 1, 2012 at 2:54 AM, S Krish <krishnamachari.sudhakar@gmail.com
wrote:
I am not sure I would recommend using Builder.. except for playing initially around.
It is better to simply use the basic capabilities in Morph and tie it up with TableLayout policy.. Proportional Layout
In that you do have a better chance of working these issues out once you get the core behaviors, the API/ methods of each of the morphs. That said many of these morphs are not perfect and will require patience to rip through the attributes you need and save to inst vars et al.
Maybe sometime soon I can package a clean MorphicView system that will alleviate this pain of figuring out Morphic.. but its fun once you figure it out..
On Sat, Mar 31, 2012 at 7:44 AM, Nelson Pingitore < pingitorenelson@gmail.com> wrote:
Hello Pharo Users. I am seeking help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes, I am creating a User Settings Class to learn how to use Pharo. I copied some core widgets from the UITheme exampleBasicControls. I would like to know, starting with the code below, how to detect if the User has selected the "Ok" or "Cancel" button in the lower right of the form, and then if the user selects "Ok" how do I detect the state of the widgets (Checkboxes, Radio buttons, or Texteditor), and save those states to instance variables?
|dialog builder radioModel treeModel CheckboxA| builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. radioModel := ExampleRadioButtonModel new. treeModel := ValueHolder new contents: TextStyle actualTextStyles explorerContents. dialog contentMorph: ( ( dialog newRow: { dialog newLabelGroup: { 'Normal Label'->(dialog newLabel: 'A Label'). 'Normal Button'->(dialog newButtonFor: nil action: nil label: 'A Button' help: 'This is a button'). 'Default Button'->((dialog newButtonFor: nil action: nil label: 'Default Button' help: 'This is a default button') isDefault: true). 'Selected Button'->(dialog newButtonFor: (ValueHolder new contents: true) getState: #contents action: nil arguments: #() getEnabled: nil label: 'A Button' help: 'This is a selected button'). 'Checkbox A'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox B'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox C'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Radio Buttons'-> ( ( dialog newColumn: { (dialog newRadioButtonFor: radioModel getSelected: #isLeft setSelected: #beLeft label: 'Left' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isCenter setSelected: #beCenter label: 'Center' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isRight setSelected: #beRight label: 'Right' help: 'This is a radio buton') } ) vResizing: #shrinkWrap ). 'Text Entry'->(dialog newTextEntryFor: (ValueHolder new contents: 'Hello') getText: #contents setText: #contents: help: 'This is a text entry'). 'Slider'->(dialog newSliderFor: (ValueHolder new contents: 0.5) getValue: #contents setValue: #contents: help: 'This is a slider'). 'Bump Temp'->(dialog newTextEntryFor: (ValueHolder new contents: '75') getText: #contents setText: #contents: help: 'This is the random shift'). }. dialog newVerticalSeparator. dialog newLabelGroup: { 'Drop List'->(dialog newDropListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four')) list: #list getSelected: #selectionIndex setSelected: #selectionIndex: help: 'This is a drop list'). 'Normal List'-> ( ( dialog newListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four'); selectionIndex: 3) list: #list selected: #selectionIndex changeSelected: #selectionIndex: help: 'This is a list' ) minWidth: 120 ). }. } ) vResizing: #spaceFill ); model: nil. builder openModal: dialog.
openInWorld / openCenteredInWorld / openInWorld: all of them should work.. openModal: does what it says...! makes the dialog modal. On Sat, Apr 7, 2012 at 9:07 AM, Nelson Pingitore <pingitorenelson@gmail.com>wrote:
When I am using a construct such as the following:
builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. . . .
model: nil. builder openModal: dialog.
is there another option other than "openModel", to use to open the dialog?
On Sat, Mar 31, 2012 at 5:34 PM, S Krish < krishnamachari.sudhakar@gmail.com> wrote:
I hope this might help...
Simple SUnit tests.. through basic morphic...
LayoutTests and MorphicWidgetTests would be nice.. #testModelAndView would be basics of what might help...
But they are really the very rudimentary stuff.. Always use Model /controller - presenter along with the View/ UI class. makes it easier..
On Sun, Apr 1, 2012 at 2:54 AM, S Krish < krishnamachari.sudhakar@gmail.com> wrote:
I am not sure I would recommend using Builder.. except for playing initially around.
It is better to simply use the basic capabilities in Morph and tie it up with TableLayout policy.. Proportional Layout
In that you do have a better chance of working these issues out once you get the core behaviors, the API/ methods of each of the morphs. That said many of these morphs are not perfect and will require patience to rip through the attributes you need and save to inst vars et al.
Maybe sometime soon I can package a clean MorphicView system that will alleviate this pain of figuring out Morphic.. but its fun once you figure it out..
On Sat, Mar 31, 2012 at 7:44 AM, Nelson Pingitore < pingitorenelson@gmail.com> wrote:
Hello Pharo Users. I am seeking help with the interaction with widgets or morphs like Checkboxes, and Radio buttons and Texteditor boxes, I am creating a User Settings Class to learn how to use Pharo. I copied some core widgets from the UITheme exampleBasicControls. I would like to know, starting with the code below, how to detect if the User has selected the "Ok" or "Cancel" button in the lower right of the form, and then if the user selects "Ok" how do I detect the state of the widgets (Checkboxes, Radio buttons, or Texteditor), and save those states to instance variables?
|dialog builder radioModel treeModel CheckboxA| builder := UITheme exampleBuilder. dialog := (builder newPluggableDialogWindow: 'Example basic controls') useDefaultOKCancelButton. radioModel := ExampleRadioButtonModel new. treeModel := ValueHolder new contents: TextStyle actualTextStyles explorerContents. dialog contentMorph: ( ( dialog newRow: { dialog newLabelGroup: { 'Normal Label'->(dialog newLabel: 'A Label'). 'Normal Button'->(dialog newButtonFor: nil action: nil label: 'A Button' help: 'This is a button'). 'Default Button'->((dialog newButtonFor: nil action: nil label: 'Default Button' help: 'This is a default button') isDefault: true). 'Selected Button'->(dialog newButtonFor: (ValueHolder new contents: true) getState: #contents action: nil arguments: #() getEnabled: nil label: 'A Button' help: 'This is a selected button'). 'Checkbox A'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox B'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Checkbox C'->(dialog newCheckboxFor: (ValueHolder new contents: true) getSelected: #contents setSelected: #contents: label: 'A Checkbox' help: 'This is a checkbox'). 'Radio Buttons'-> ( ( dialog newColumn: { (dialog newRadioButtonFor: radioModel getSelected: #isLeft setSelected: #beLeft label: 'Left' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isCenter setSelected: #beCenter label: 'Center' help: 'This is a radio buton'). (dialog newRadioButtonFor: radioModel getSelected: #isRight setSelected: #beRight label: 'Right' help: 'This is a radio buton') } ) vResizing: #shrinkWrap ). 'Text Entry'->(dialog newTextEntryFor: (ValueHolder new contents: 'Hello') getText: #contents setText: #contents: help: 'This is a text entry'). 'Slider'->(dialog newSliderFor: (ValueHolder new contents: 0.5) getValue: #contents setValue: #contents: help: 'This is a slider'). 'Bump Temp'->(dialog newTextEntryFor: (ValueHolder new contents: '75') getText: #contents setText: #contents: help: 'This is the random shift'). }. dialog newVerticalSeparator. dialog newLabelGroup: { 'Drop List'->(dialog newDropListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four')) list: #list getSelected: #selectionIndex setSelected: #selectionIndex: help: 'This is a drop list'). 'Normal List'-> ( ( dialog newListFor: (ListModel new list: #('One' 'Two' 'Three' 'Four'); selectionIndex: 3) list: #list selected: #selectionIndex changeSelected: #selectionIndex: help: 'This is a list' ) minWidth: 120 ). }. } ) vResizing: #spaceFill ); model: nil. builder openModal: dialog.
participants (2)
-
Nelson Pingitore -
S Krish