Hybrid View

  1. #1
    Sencha User
    Join Date
    Sep 2011
    Location
    Leipzig, Germany
    Posts
    75
    Vote Rating
    2
    A.Rothe is on a distinguished road

      0  

    Question Selection

    Selection


    Hi,

    I'm looking for a framework for a project. A main feature will be the selection of some fields (like textfields or comboboxes or checkboxes) with the mouse. The new examples contain the possibility to draw within GXT. Is it possible with the new 3.x version to draw a half-transparent square (or a rectangle with a dotted border) over some field elements and to get the selected objects? A simple example I have written in Java Swing: https://www.phosco.info/builder.jnlp

    Thanks a lot
    André

  2. #2
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,734
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    I'm apparently unable to connect to your site (using either https or http), perhaps you can post a screenshot of what you are trying to accomplish?

    Drawing a transparent square on the page isn't a big deal, as html/css can allow you to position and style an element fairly simply. By default, GXT fields are highlighted when you focus on them - take a look at http://sencha.com/examples-dev/#Exam...e:formsexample to see. Adding handlers on blur/focus to do additional drawing shouldnt be too difficult.

  3. #3
    Sencha User
    Join Date
    Sep 2011
    Location
    Leipzig, Germany
    Posts
    75
    Vote Rating
    2
    A.Rothe is on a distinguished road

      0  

    Default


    Sorry, sometimes the server is has no public IP. At the moment it is available. With a screenshot I cannot really describe, what I need. The example is part of a WYSIWYG builder, so the most important parts are

    * selection of the graphical elements on a page
    * moving the selected elements around (doesn't work within the example)
    * resizing the elements (doesn't work in the example)

    All actions should be possible with the mouse. The elements must be GXT fields like TextFields, ComboBoxes, CheckBoxes, Radios. Fields can have labels on different positions (left, right, top...) At the moment we discuss, how we should implement the frontend: SWING or browser-based.

    In the example you can use the left mouse to select some elements and you have a context menu, which offers some things. The mouse pointer will be changed, if you move to the border of an element. You can also use the Shift or Ctrl key to select multiple elements or you draw a rectangle around the elements.

    If you say, all these things are possible with GXT, I would implement an example to have more weight in the discussion...

    Thanks a lot
    Andre

  4. #4
    Sencha - GXT Dev Team
    Join Date
    Feb 2009
    Location
    Minnesota
    Posts
    2,734
    Vote Rating
    90
    Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light Colin Alworth is a glorious beacon of light

      0  

    Default


    So the fields on the page only appear to be fields, but are not used as fields (no need for entering values, focus, blur) for the sake of arranging them?

    Quickest and easiest to demonstrate that would be to disable all of the fields, and wrap each in a DragSource. Make the container they are put in be wrapped in a custom DropTarget, customized a bit so it inserts in the right place correctly (take a look at ListViewDropTarget for the idea of how this could be done).

    To improve slightly upon this, dont create the field in the first place (to avoid the cost of the extra parts of that widget you aren't using).

    Adding resize won't make sense for some of these fields, but the trick of adding it isn't too hard. We don't yet have a 3.0 example for this, but the 2.x example should work much the same way: http://sencha.com/examples/#resizable. The more interesting part will be preventing things like Checkboxes and radios from resizing at all, and permitting TextField, ComboBox, etc to resize only in one direction.

    Selecting can be done as I mentioned in the first post, or by creating another wrapper like DragSource and Resizable, which adds the mouse events for selecting a field, and hooks into whatever selection system your app requires. Looking at the existing code (ListViewSelectionModel would be a good start) for handling shift, ctrl.

Thread Participants: 1

Tags for this Thread