Help please?

Hi,
I'm trying to create a DX object that is animated and can contain shortcut links within the animation. Is this possible to do? I am designing my first original dxtheme and this is now the only problem that I face to complete my theme! Even if this needs a Java script that would be cool except I would need someone to write that java for me, as I am stupid to java.

The animation is of a scroll "unrolling" on mouseover and it "re-rolls" on mouse away.....The links/shortcuts is what I would like to put on top of the "unrolled scroll"...so far I have tried to create an object controller "popup" layer to add the 5 or so links/shortcuts with the "opened scroll" image. Which means that you have to click your mouse twice instead of once to get to whatever the link/shortcut represents. I am trying to achieve a single click instead of double click since I have the "rolling" effect with the animation.

<<--------->> this is a rough "rolled" example LOL
<<--------->>

<<---------->> the rough "unrolled" example LOL
| |
| (Link) |
| (Link) |
| (Link) | animation is part of ALL the imagery ( the links don't need to be animated.)
| (Link) |
| |
<<---------->>
It is a layer. The problem is that I want no shortcuts showing when the scroll is closed and cannot add any shorcut to the image(s) without them appearing( being always present) before I want them to...ergo..when the animated scroll starts animating on mouseover it will be closed and the animation opens it....the mouse away animates the scroll back up (closed scroll). The entire object(layer) is one set of frames animated. So I need to put working links in the "opened" picture( 1 Frame) of the scroll so that it can be one click instead of a "popup layer" with working shortcuts on it.

Thank you in advance....you may email me { [email protected] } if you would like to see this design issue so that maybe you could help me get what i'm trying to achieve.

Speedy
3,123 views 11 replies
Reply #1 Top
Hi. I'm a newbie and I am trying to accomplish the same thing you are. I think I may have part of the answer as far as making the links appear AFTER the animation finishes and not before. However, it is an incomplete script as I am trying to work out one last kink. The one thing wrong with this script is that when the mouse is over the link it treats this action as MouseLeaving the scroll and will begin the re-rolling animation. I don’t know how to correct this. If you or anyone else has the answer please help me out.


This is what I have done:

(Try this on a test object before applying to your actual work)

*1. Add a new state called ‘unscroll’. Copy the settings from your mouse over state.(e.g. animated image and settings). Delete your mouse over state.
**2. Add a new state called ‘rescroll’. Copy the settings from your mouse away state. Delete your mouse away state. (Your scroll should not be an object controller)
3. Position your link object over the unrolled scroll. Set the parent to the scroll object. Change the visibility of your link object to ‘no’. (Your links should not be popups)


Put this piece of script into your scroll object:


Sub Object_OnMouseEnter
Object.state= "unscroll"
End Sub

‘Makes the links appear AFTER the animation has finished
Sub Object_OnStateChanged(state)
If state= "unscroll" Then
DesktopX.Object("link").Visible=True
End If
End Sub

Sub Object_OnMouseLeave
DesktopX.Object("link").visible=False
Object.state= “rescroll”
End Sub

*I tried OnStateChanged using a ‘mouseover’ state but it did not work. So the solution was to create my own state called ‘unscroll’

**For me, using the mouse away state caused my object to rescroll every time it was loaded beacause my mouse was 'away', so I created the rescroll state instead and that corrected it.

Let me know if it works for you.

P.S.: Can anyone help me with the Mouse over link = mouseLeave scroll problem?
Reply #2 Top
you can also use a MASK item that would cover the whole back area.
I used this same setup for the GalCivII Drive Meters.

There is a main object that has a masked area where the drives reside.
When you expand the width of the back, and the mask it will show the drives inside the masked area.

Import the drive meters as a widget and see how i did it.
Try it: Link


Good luck!
Reply #3 Top
RomanDA, how exactly does this mask effect work (specifically how does hide the contents)? I got your meter but I don't understand any of the scripting involved. Is your technique applicable to an object that uses mouse over/ away to open & close as opposed to clicking another object?
Reply #4 Top
Ok..

I made a test object.. i dont think its "approved" yet..

This has 4 objects sitting on top of a transparent area, that is on top of the master back item.

The mouseover causes a timer to fire that makes its width "grow".
then when you move the mouse off the area it "shrinks" back.

You can see the 4 objects on top of the transparent item show up and vanish this way.

The Link is here, but it has to be approved:

Link

Hope it helps.

The script is not very complicated.
It just runs a timer that expands the width till it gets to the MaxW (max width)
then when the mouse out runs it does the opposite.

Let me know if this makes sense.

This item uses the width, not the height you want to use for your example. but that shoukdnt be hard to adjust.
Reply #5 Top
Thanks for taking the time RomanDA! I'll try to replicate your technique on my object and get back to you. Thanks again.
Reply #6 Top
RomanDA, I finally mastered your masking technique!

Only problem is, it won't work for my object. My object is circular and I need it to grow radially. As far as I can tell there is no way to make your image or object grow outwards and equally on all sides. The only way to accomplish this is by animation and that countermands the technique you use. Is there any way to make your object grow radially? As of now I am back to square one with my mouse over = mouse away problem.
Reply #7 Top
I think its possible by changing the height and the width, as well as moving the top/left each time so that the object stays "centered".

You would have to add code to the shrink/grow to do this, but it shouldnt be that hard.

If you have trouble please email me at skins @ Romanda . org and attach the widget and ill see if i can fix it.
Reply #8 Top
It worked! Changing the top and left as well as the height and width made the object appear to be growing radially. BUT it took me a while to realize that in your demo object the activiation of the areas inside was set to 'none' as that is the only way to stop the mouse over= mouse away problem. However I need the activation so the links can work, and again, if the links are active the same problem arises. I've been at this for over a week and I can't seem to make it work. I haven't given up yet but it's starting to look like an impossiple task to accomplish. I'll keep asking around. Thanks for all your help, RomanDA. I've learned a lot!
Reply #9 Top
GOOD NEWS, RomanDA! It wasn't impossible after all! I managed to simulate the mouse over link effect (and subsequently the mouse click effect) by using OnLbuttonUp in the script for the main object. My method takes a bit of calculating and guess work but IT WORKS!

Here is the piece of code I added:

Sub Object_OnLbuttonUp (x,y, dragged)
If system.CursorY < Object.Top +50 Then
If system.CursorY > Object.Top +20 Then
If system.CursorX < Object.Left +105 Then
If system.CursorX > Object.Left +20 Then
DesktopX.Object("link").ExecuteCommand
End If
End If
End If
End If
End Sub

It’s a bit lengthy but the code basically provides parameters within the main object where the link is situated so if I click on the main object within those parameters it appears as though I am clicking on the link. Executecommand launches the shortcut remotely. To do another link I simply add on to the code and change the parameters:

Sub Object_OnLbuttonUp (x,y, dragged)
If system.CursorY < Object.Top +50 Then
If system.CursorY > Object.Top +20 Then
If system.CursorX < Object.Left +105 Then
If system.CursorX > Object.Left +20 Then
DesktopX.Object("link").ExecuteCommand
End If
End If
End If
ElseIf system.CursorY < Object.Top +75 Then
If system.CursorY > Object.Top +60 Then
If system.CursorX < Object.Left +130 Then
If system.CursorX > Object.Left +50 Then
DesktopX.Object("link2").ExecuteCommand
End If
End If
End If
End If
End Sub

Seems like a lot to go through but so long as it works, I’m satisfied! If you or anyone else knows of a way to modify this script so that it is not as extensive please do let me know. Once again, thanks for everything RomanDA. You’ve been a tremendous help.
Reply #10 Top
Im glad you got it to work, let me know when its uploaded so i can see what it looks like!

Im glad your learning DX, its a great program.
Reply #11 Top
Hey, RomanDA. I finished it earlier this month. But because my object is personalized to my computer and such, I don't think I'll upload it (won't do much good on another user's computer if they don't have the programs I use).

Here's a picture of it though! LINK- Link

Once again, thanks for everything!