How to turn my arrows even when the widgets are closed?



Here I got two sections, Pickup Time and Dropoff Time. The main thing that I wanna solve is to turn the arrows when they are selected immediately without closing the sections individually.

Here’s a video for better visual aid:

And here’s the code itself:
cloneTester.rp (2.0 MB)

Thanks in advance


Take a look at the “TimeTester (1)” page of this updated RP file:
cloneTester.rp (2.1 MB)

I tried to simplify the logic for this to make the arrow position/rotation more reliable, and allow for keeping the time selection area visible when switching between Pickup and Dropoff tabs. Here is a summary of what I changed:

  • Removed unnecessary and duplicate actions and named some widgets for easier coding.
  • Created a dynamic panel (DP) for “Time Selection”
    • Moved the “Pickup Time” and "Dropoff Time groups to separate states in this DP
    • In this way, you can show either Pickup Time or Dropoff Time, but not both. Switching between the two is easy with a Set Panel State action.
  • Removed the top rectangle in the “Pickup Time” and “Dropoff Time” groups and cut & pasted their interaction code to the group itself. This makes it more reliable and easier to see the code.
  • Removed the “User Selects Time” selection group from the background rectangles in the “Pickup Time” and “Dropoff Time” groups, and assigned it to the groups themselves.
    • So now, when the “Pickup Time” group is selected, the “Dropoff Time” group is automatically unselected, and visa-versa.
  • Set the selected style of the “Select a time” text widgets to have a white font color.
    • So now, when the “Pickup Time” group is selected, the background turns blue and the text turns white.
  • To the background rectangle in each of these groups (e.g., I named one “pickupTime”) I assigned Selected and Unselected events to rotate the arrows. (Groups of widgets do not support the Selected and Unselected events; I don’t know why not.)
    • It should be more reliable to rotate the arrow widget “To” a specific rotation angle instead of just rotating it “By” 180°, but for some reason there is a bug when rotating a shape that is already rotated (e.g., your arrow shapes have a default rotation of 270°) …so I kept your basic code of rotating by 180° and it works.
  • To the “Pickup Time” and “Dropoff Time” groups each, I changed the Click or Tap events to have two conditional cases:
    • Case 1 : If state of Time Section equals <the other group> and visibility of Time Section equals true
      • Set Selected/Checked This to "toggle"
      • Set Panel State Time Section to <this group>
    • Case 2 : Else if true
      • Set Selected/Checked This to "toggle"
      • Set Panel State Time Section to <this group>
      • Toggle Visibility Time Section Show slide doewn linear 350ms, Hide slide up linear 350ms
    • So, Case 1 will fire if “Time Section” is visible and "Time Section is set to the other group (e.g., if “Pickup Time” cilcked but “Dropoff Time” is selected an shown.) It toggles its own selection state (thus setting it to unselected) and sets the DP state to the other one, providing a way to keep the Time Section showing (not closed.)
    • Case 2 will only fire if Case 1 is false, meaning Time Section is either hidden or Time Section is already set to the same selection group (e.g, Pickup Time is clicked when Pickup Time is selected.) If Time Selection is hidden it is shown, and if Time Selection is shown (and set to the same group) it gets hidden.
  • Finally, for good measure I made a Shown and a Hidden event for the Time Section DP to ensure the proper Time group is selected when shown and unselected when it is hidden. This can help if you need to set a mode remotely (through something other than the user clicking the “Pickup Time” or “Dropoff Time” group.

closed #3

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