Hi,
It is the styling of the new widget (ButtonGroupBox). The new style is
called "button-groupbox".
in appearance, we define that the style
"button-groupbox" is "derived" from "groupbox" (that is correct because it
is a groupbox anyway)
and its legend ("button-groupbox/legend") is a button (alias) so it will
get the style of a button.
A+
On Mon, Dec 19, 2011 at 9:09 PM, Simon White <
[email protected]> wrote:
> Hi
>
> My code was almost identical. The part I did not have was the block to
> put in the appearances. Can you tell me exactly what that block does?
>
> Thanks,
> Simon
>
>
> On 19/12/2011 8:20 PM, Aiman Sawan wrote:
> > Hi,
> >
> > Here is what I am using in my project:
> >
> > first, define in your project the class ButtonGroupBox.js (source are
> > bellow - adjust the package name) which is highly inspired from
> > CheckGroupBox.js. this is why I left original notice.
> >
> > then, add the following block to Appearance.js (into appearances {}
> > object) of your project:
> >
> > *"button-groupbox" : "groupbox",
> > "button-groupbox/legend" : {
> > alias : "button",
> > include : "button"
> > }*
> >
> > ======
> >
> > *ButtonGroupBox.js*:
> >
> >
> /*******************************************************************************
> > *
> > * qooxdoo - the new era of web development
> > *
> > * http://qooxdoo.org
> > *
> > * Copyright: 2004-2008 1&1 Internet AG, Germany, http://www.1und1.de
> > *
> > * License: LGPL: http://www.gnu.org/licenses/lgpl.html EPL:
> > * http://www.eclipse.org/org/documents/epl-v10.php See the LICENSE
> > file in the
> > * project's top-level directory for details.
> > *
> > * Authors: Sebastian Werner (wpbasti) Andreas Ecker (ecker) Martin
> > Wittemann
> > * (martinwittemann)
> > *
> >
> ******************************************************************************/
> >
> >
> > /**
> > * A group box, which has a button as a legend.
> > * It is highly inspired from qx.ui.groupbox.CheckGroupBox.js
> > *
> > * Authors: Aiman Sawan
> > *
> > * @childControl legend {qx.ui.form.Button} button
> > */
> >
> > qx.Class.define("butor.control.ButtonGroupBox", {
> > extend : qx.ui.groupbox.GroupBox,
> > implement : [qx.ui.form.IExecutable, qx.ui.form.IModel],
> > include : [qx.ui.form.MModelProperty],
> >
> > properties : {
> > // overridden
> > appearance : {
> > refine : true,
> > init : "button-groupbox"
> > }
> > },
> >
> > events : {
> > /** Fired if the {@link #execute} method is invoked. */
> > "execute" : "qx.event.type.Event"
> > },
> >
> > members : {
> > /*
> > *
> >
> ---------------------------------------------------------------------------
> > * WIDGET API
> > *
> >
> ---------------------------------------------------------------------------
> > */
> >
> > // overridden
> > _createChildControlImpl : function(id, hash) {
> > var control;
> >
> > switch (id) {
> > case "legend" :
> > control = new qx.ui.form.Button();
> > control.setLabel("");
> > control.setAllowGrowX(false);
> > control.addListener("resize",
> > this._repositionFrame, this);
> > control.addListener("execute", this._onExecute,
> > this);
> >
> > this._add(control, {
> > left : 0
> > });
> > }
> >
> > return control || this.base(arguments, id);
> > },
> >
> > /*
> > *
> >
> ---------------------------------------------------------------------------
> > * EVENT LISTENERS
> > *
> >
> ---------------------------------------------------------------------------
> > */
> >
> > /**
> > * Event listener for execute event of checkbox.
> > *
> > * @param e
> > * {qx.event.type.Event} Event which holds the
> > * current status
> > */
> > _onExecute : function(e) {
> > this.fireEvent("execute");
> > },
> >
> > /*
> > *
> >
> ---------------------------------------------------------------------------
> > * REDIRECTIONS TO LEGEND (CHECKBOX COMPATIBILITY MODE)
> > *
> >
> ---------------------------------------------------------------------------
> > */
> >
> > // interface implementation
> > execute : function() {
> > this.getChildControl("legend").execute();
> > },
> >
> > // interface implementation
> > setCommand : function(command) {
> > this.getChildControl("legend").setCommand(command);
> > },
> >
> > // interface implementation
> > getCommand : function() {
> > return this.getChildControl("legend").getCommand();
> > },
> >
> > /**
> > * The label of the groupbox.
> > *
> > * @return {String}
> > */
> > getLabel : function() {
> > return this.getChildControl("legend").getLabel();
> > },
> >
> > /**
> > * Configures the label of the groupbox.
> > *
> > * @param value
> > * {Boolean} <code>true</code> when enabled.
> > */
> > setLabel : function(label) {
> > this.getChildControl("legend").setLabel(label);
> > },
> >
> > /**
> > * The icon of the groupbox.
> > *
> > * @return {String}
> > */
> > getIcon : function() {
> > return this.getChildControl("legend").getIcon();
> > },
> >
> > /**
> > * Configures the icon of the groupbox.
> > *
> > * @param icon
> > * {String} <code>true</code> when enabled.
> > */
> > setIcon : function(icon) {
> > this.getChildControl("legend").setIcon(icon);
> > }
> > }
> > });
> >
> > ============
> >
> > usage:
> > ...
> > var userInfoGB = new *butor.control.ButtonGroupBox*(this.tr
> > <http://this.tr>('Preview >>'));
> > userInfoGB.setLayout(new qx.ui.layout.VBox(5));
> > userInfoGB.add(...)
> > userInfoGB.addListener('execute', this.__togglePreview, this);
> > ...
> >
> > ======
> >
> > A+
> >
> > On Mon, Dec 19, 2011 at 5:59 PM, Simon White
> > <[email protected]
> > <mailto:[email protected]>> wrote:
> >
> > Hi
> >
> > I have been trying to modify the GroupBox so that instead of an Atom
> for
> > the legend is has a button that you can click to execute some code.
> > Does anyone have a working example they could share?
> >
> > Thanks,
> > Simon
> >
> >
> >
> >
> ------------------------------------------------------------------------------
> > Write once. Port to many.
> > Get the SDK and tools to simplify cross-platform app development.
> Create
> > new or port existing apps to sell to consumers worldwide. Explore the
> > Intel AppUpSM program developer opportunity.
> > appdeveloper.intel.com/join <http://appdeveloper.intel.com/join>
> > http://p.sf.net/sfu/intel-appdev
> > _______________________________________________
> > qooxdoo-devel mailing list
> > [email protected]
> > <mailto:[email protected]>
> > https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
> >
> >
> >
> >
> > --
> > <!--
> > Aiman Sawan
> > http://www.butor.com/
> > It's simple to make things. It's hard to make things simple.
> > -->
> >
> >
> >
> ------------------------------------------------------------------------------
> > Write once. Port to many.
> > Get the SDK and tools to simplify cross-platform app development. Create
> > new or port existing apps to sell to consumers worldwide. Explore the
> > Intel AppUpSM program developer opportunity. appdeveloper.intel.com/join
> > http://p.sf.net/sfu/intel-appdev
> >
> >
> >
> > _______________________________________________
> > qooxdoo-devel mailing list
> > [email protected]
> > https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
>
>
>
> ------------------------------------------------------------------------------
> Write once. Port to many.
> Get the SDK and tools to simplify cross-platform app development. Create
> new or port existing apps to sell to consumers worldwide. Explore the
> Intel AppUpSM program developer opportunity. appdeveloper.intel.com/join
> http://p.sf.net/sfu/intel-appdev
> _______________________________________________
> qooxdoo-devel mailing list
> [email protected]
> https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
>
--
<!--
Aiman Sawan
http://www.butor.com/
It's simple to make things. It's hard to make things simple.
-->
------------------------------------------------------------------------------
Write once. Port to many.
Get the SDK and tools to simplify cross-platform app development. Create
new or port existing apps to sell to consumers worldwide. Explore the
Intel AppUpSM program developer opportunity. appdeveloper.intel.com/join
http://p.sf.net/sfu/intel-appdev
_______________________________________________
qooxdoo-devel mailing list
[email protected]
https://lists.sourceforge.net/lists/listinfo/qooxdoo-devel
