Moved logic not work for me


#1

I used Moved event and adding some logic for the widget to run but it’s not working
image
can anybody tell me what did i miss or where did o go wrong with the logic ?


#2

Nothing wrong with the logic, so it must be something else. If you could post your .rp file then users here can help determine the issue.


#3

Here is the file, thank you for your reply
bake UI.rp (951.8 KB)


#4

moving

When using “move interaction”, unable to obtain real-time coordinates when moving.


#5

thank you, i will have to firgure out other way.


#6

Oh and one more question if possible, i want to pull another event with x of widget from [x1 to x2] location, which logic should i use for this matter ?


#7

I’m not really sure what you are trying to do here… Maybe this is part of a video game with a difficult user task? You have set up a bunch of Loaded events that move some things back and forth. Is this working the way you intend?

The only Moved event like the one you post above appears to be on a widget named, “fire point”, confusingly within a dynamic panel named, “Point fire” --but the “fire point” widget never gets moved. So that would be a big part of your problem. The conditional logic of Moved also makes no sense:
image

  • The expression, [[This.x]] would always be a numeric value, representing the location (left edge) of this widget, in pixels
  • The expression, [[This.x=300]] does not mean anything, and Axure would always, I believe, treat it as a string: "[[This.x=300]], so your logic here is definitely broken. As is, the first part of the conditional case logically equates to "If the horizontal location of this widget is greater than “[[This.x=300]]” which will always evaluate as false–and likewise for the second part of your condition.
  • The widget you are trying to show, “button 1” is a Hotspot widget. Hotspot widgets are never user-visible, so there will be no indication to the user if and when it is technically visible or hidden. The result would be–even if this was all to work–when user clicks on the “big pink button” sometimes nothing would happen (“button 1” hidden) and sometimes the size of some other unnamed widget would change. …With no affordance or explanation as to why. And once this hotspot is set to Shown, I can’t tell that it ever gets hidden again, so the end result would be that clicking the big pink button would do nothing for the first 667 ms, then get handled as a click (via “button 1” hotspot) forever after that. …Or, if “button 1” is intended to be hidden again and only shown when your “fire point” widget is between 300 and 323 px, then the user could only click “button 1” for a fraction of a second–about 115 ms --whereas human reaction time is 250 ms at best, so basically mostly luck if your button ever actually gets clicked. Is this your intent?

Now, I think what @Jorkin points out above is that if you set a Move action from point A to point B, along with an animation (e.g., “swing 1500 ms”) there is no way to determine an interstitial location (i.e., any pixel location between point A and point B) This is because Axure (and the underlying javascript/jQeury code) immediately updates the widget’s location value (e.g., from x=167 to x=466) and then animates the visual transition separately from the widget’s actual x-location value.

The way to get around this is to successively move the widget a small amount–a slice of the overall distance–and repetitively move it by that amount until the widget reaches point B. So, if you moved “fire point” 10 px per “distance slice” over a total distance of 299 px (466 - 167 = 299 total px of movement), that would be 30 Moved events, and if you moved it 1 px per slice, it would be 299 Moved events. For smoother animation, I’ve found it better to slice by time (e.g., fractions of your 1500 ms animation duration) So, if you wanted 10 “time slices” then each slice would be 1500/10=150 ms, and each movement amount would be 299/10=29.9 px, rounding to 30 px distance.

Here is an updated file with a potential solution on Page 2. I created timers (dynamic panels with repeating state changes) to control your animations:

  • timer1 controls movement of “fire point” to the right, in 150 ms time slices
  • timer2 controls movement of “fire point” to the left
  • timber3 controls movement of “red bar group” back and forth
  • timer 4 controls movement of the clock hand

(The method of “Wait 0 ; Fire Loaded” is not good for these animation purposes. It results in more events being fired than can be handled, potentially crashing your browser/system and making it hard if not impossible to stop the animations if and when you need.)

I increased the “clickable” range from 300–323 px to 300–373 in order to give user a chance of being able to click it. For demonstration purposes, I set a Disabled Style for your big pink button with a lighter fill (and disabled by default) so you can visually see the change to Enabled. You can delete this Interaction Style if you don’t want the user to see this change.

The Moved event of “fire point” has cases to enable and disable the button, as well as start and stop timer1 and timer2, all based on its x-location.

  • The guide lines are also just for demonstration purposes.

bake UI.rp (1.8 MB)


#8

thank you, im new to axure and still on the way to learn how to use it
once again thank you so much


closed #9

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.