Selection box is dragged, but not the object - html5-canvas

I'm using FabricJS for some project, and my goal now is to save the new coordinates when the user drag an object. My issue is that when I select an object and move it, the selection box moves but not the object.
Image there:
I have some code which deal with object selection and mouse click and move events, so I tried to remove them but the issue persists.
Edit: looks like it's only a graphical issue, because the object:moved event is well triggered.
Edit 2 : after some progress in the development, this bug has mutated: now the object and the selection box move together, but I have to click two times on the object to make the selection box appear (while the selection events are triggered on the first click).

Related

Issue with animating ui elements in unity 3d

I've added an animation clip to a canvas which animates position and alpha channel of its children (like buttons etc.). Now I'm gonna play this animation via pressing the play button (one of itself's children) as shown as here:
(Click om images to see in full screen)
I created a trigger in mecanim and sat as the trigger of transiting to that animation but it didn't work. Is there any ways else or was my job correct and did I some mistakes?
Please help, thanks
In the animator window just making the trigger doesn't do anything. You need to set the trigger by getting a reference to the animator and calling SetTrigger("yourTriggerName"). You can call this in the inspector using the UI button's OnClick() method.
Go to the inspector for the play button and scroll down to where you see this:
click the plus sign and then drag the game object with the animator you want to trigger onto the field that says None(Empty) then select the animator from the drop down menu that appears and select the SetTrigger function. Then type in the name of your trigger Exactly. Upper case matters. That's it. It should look something like this when you are done:
Obviously, you will have to use the correct GameObject and trigger name so yours will look a little different.

Unity UI Button not calling the Onclick method

I have a button under a canvas that is suppose to restart the scene. But instead its not calling the intended function of attached script.
On Unity Forums, I found solutions like it should be at higher hierarchy in canvas, and the canvas should have a graphic raycast and so-on.
But it still isn't working, although its on click array detects the intended method it is suppose to call.
Scene Editor with Canvas Selected:
Scene Editor with Button Selected:
Remove the canvas component from your button.
Make sure that there is a GraphicRaycaster on your canvas, and that there is an EventSystem object somewhere in the hierarchy.
(Both should have been added when you first added the canvas, but things get lost)
The screenshot that shows your button being selected, also shows, that you did pick a gameobject for the OnClick event, but you didn't pick a function from the drop down right next to that field, it says no function.
Instead of selecting the C# class, select the GameObject that
btnSceneSelect is attached to.
If btnSceneSelect is not attached to a GameObject, attach it to one
(other than the button).
Taken from this site

Kendo UI Toolbar and Grid - strange save behavior when triggered from Toolbar control

I have some pages where I have a kendo ui grid (wired up to full CRUD services), but use a separate Kendo UI Toolbar control (as opposed to the toolbar configuration in the grid itself). I have a number of different buttons/menus on the toolbar, but am seeing a strange behavior when calling saveChanges() on the grid. If a cell is being edited when the save button is clicked, the grid is saved, but the edited value is lost (it reverts back to where it was). The following details what I see in different situations:
When using a save button configured in the grid (command: "save"), any changes in a cell being edited are committed with the save.
When using a plain html button that calls the saveChanges() method of the grid, any changes in a cell being edited are committed with the save.
When using a save button configured in a toolbar control, the changes in a cell being edited are LOST when saveChanges() is called.
The following jsbin shows the behavior of all three:
http://jsbin.com/jazobexatu/2/edit?html,js,output
I have tried calling the save from the toolbar button a number of different ways (even trying to trigger the click event of the external button), but nothing seems to correct the behavior. I also tried calling closeCell() on the grid (to try to force the value back into the data, but that doesn't work either). I haven't been able to debug the javascript enough to figure out what is different. I'm hoping someone with a deeper understanding of these controls can help me out.
For some reason, the mouse down event on the toolbar button doesn't cause a blur on the editor.
You can try it yourself by clicking in the cell to edit it, then click and hold the mouse button down on the "normal" button. The editor closes on mouse down, causing a blur of the editor, and persists the change.
If you do the same thing, click and hold mouse down, on the toolbar button, the editor stays open.
I've been poking through the source, but haven't figured out exactly why this happens. My best guess would be that the mousedown handler on the toolbar prevents the event from bubbling or running its default action and the editor doesn't blur.
Additional detail: On mousedown on the grid header button and the normal button, the focused element changes (which is what causes the editor blur). But on mousedown of the toolbar button, the editor input element still has the focus.
Shifting the focus on mousedown of the toolbar might be a workaround.
Sort of a weird hack, but this works in Chrome (any should in any browser that supports activeElement
click: function (e) {
$(document.activeElement).blur();
$("#grid").data("kendoGrid").saveChanges();
}

NSTextField dragging values

I am trying to create a text field in the Mac OSX environment that allows a user to select a number and drag horizontally to adjust that number up and down.
I know this can be done because Apple have implemented it in the inspector panel of the Sprite Kit emitter section: see the image
I have tried sub classing NSTextField to capture mouse drag events and doing the math, but they don't seem to get passed through. The mouse down event does though...
I have also tried placing a dummy view over the top and catching events as they come through. This works for mouse down, but again, the mouse dragged is never called. I know that the view can receive the mouse dragged event though, because if I place that view somewhere that a text field isn't under it, everything works fine.
What are my options here? I feel I have tried everything and the only option left is to create a new control from scratch. I don't mind that too much, but I also want the user to be able to add equations in the text field and drag individual values - that means the full functionality of NSTextField will need to be rebuilt just to add this dragging feature... Is there anything else???

How does the Outlook app delete checkbox UI xaml code work?

If you tap on the left hand side of the screen in Outlook then an event is triggered (in this case a checkbox appears).
I would like to know the xaml on how this is achieved. It cannot be a simple "MouseLeftButtonUp" event because if you drag your finger more than a few pixels then the event does not trigger.
In my own app I am trying to get an icon appear within a listbox that has a SelectionChanged event. The issue is that if you do not touch the small icon precisely then you are triggering the listbox event rather than the event I want to occur when pressing the image.
I think I need to wrap my image in a Canvas but then am still stuck as to what the event should be.
How do you increase the target size of the area where a user can click on your element?
What event should an image have when within a listbox (which is within a pivot) that has a SelectionChanged event? (MouseLeftButtonUp causes issues if you half drag to the next pivot and lift your finger - it triggers the MouseLeftButtonUp event)
I implemented something very similar to that behavior by making an itemtemplate where the checkbox was pushed offscreen to the left by using a negative margin.
I then created 2 visual states, one for Open and Closed. The open state set the margin to 0, bringing the checkbox back onscreen. Closed state had the negative margin.
With the fluidmove behavior, switching between states on button press was EASY. The only thing you'd have to add would be an invisible button/touch area on the left that would also trigger "opening" the checkbox column (changing state to reset the margins).
Hope that helps...
The outlook app is a native app, so it probably isn't using xaml at all.
If you're worried about the mouse events, then you should look at the gesture stuff in the silverlight toolkit, it contains tap, etc events that make a little more sense on the phone.
Increasing the target size and generally making stuff touchable: wrap it in a Button, then alter the ControlTemplate for the Button to remove the border.
If you look at the ControlTemplate for a Button, (Expression Blend, Edit Template, Edit a copy) you'll see the mechanics of the touch area. It's nothing more than padding/margin.
Thus, you can't bleed your touch region out without altering the layout and affecting other items around the control. I'd do two things:
First, I'd think about whether my whole control should be larger in the first place with good spacing around it. Is my design right?
Second, I'd cheat. I'd float a fixed sized button with no border over the area using the Translate transformation to move it around freely.
Good luck,
Luke

Resources