Show hide symbol in Adobe Edge - animation

Just trying to get my head around Adobe Edge. What I want to achieve sounds simple but having real trouble. I have a button element, that when mouseover, displays an animated symbol I have.
Currently my code,on the button is Mouseout:
sym.$("pgicatext2").hide();
and mouseover:
sym.$("pgicatext2").show();
This doesn't seem to be working. I can achieve the result if, I turn off the movie symbol, and use this code on the button
sym.$("pgicatext2").toggle();
The trouble is of course it doesn't replay the animation every time you mouse over, and all the while it's hidden it's playing the animation.

I see its been a month since you posted this. Hopefully you solved your issue. Your code for hiding and showing looks right. One thing I have had happen in some of my projects is that I inadvertently placed an object or symbol with 0% opacity on top of a button or something I had a mouse over event. Make sure that the button you have does not have anything layered on top of it. Another thing would be to turn off autoplay of your symbol, and add sym.$("pgicatext2").play(); into your mouse over. I know those are pretty obvious answers, but sometimes it is easy to forget the obvious.

Please get through following steps:
Check if the button is over all other visible layers ('Elements'
tab). Maybe setting cursor to 'pointer' will help to check it.
Use 'Mouseenter' and 'Mouseleave' instead of 'Mouseover' and
'Mouseout'. The difference is explained here.
Make sure that your animated symbols 'autoplay' option is off. If
you did not tick it off while creating the symbol, just set Playback
to 'Stop' on Stage at the very beginning of the timeline
Lets do some coding. Lets assume that your animated symbols name is
"film". You need to set following actions to your button element:
Mouseenter:
sym.$("film").show();
sym.getSymbol("film").play();
this basically shows up your 'film' element and plays 'film' symbol
Mouseleave:
sym.$("film").hide();
sym.getSymbol("film").stop(0);
this one hides your 'film' element and stops 'film' symbol at the beginning of animation (0ms)
Enjoy!

Related

Why do AxWindows Media Players affect Full Screen Generation in Visual Studio?

I'm using many AxWindows Media Players (AxWMPLib) to play sound in my piano application on Visual Studio. I'm not using them for video, and so they are all invisible. I also want to play my application in full screen mode. The full screen mode works fine with no media players, all the anchors work correctly as I want. This is the full screen without the Media Players and it is all good
However, as soon as I add one media player, it then looks like this? The anchors break and the full screen mode completely alters? I don't know why this happens, and I am really stuck as to why adding an AxWMPLib breaks the anchors like this, without altering the AxWMPLib at all.
Does anyone know why this is the case and how to fix it?
Thank you in advance :D
I have found an answer to this problem! I hope my solution below will help anyone in the future. If you are using AxWMPLib and want the form to be fullscreen, all the elements might not anchor correctly, and stay in the top left corner of the screen (like the screenshots in the question).
I found this to be caused by the WindowState Property in the Layouts section. Rather than setting the WindowState Property as Maximised, keep it as Normal, and then change the WindowState Property programmaticly in the Form_Load Sub, with the following code:
Me.WindowState = FormWindowState.Maximised
And then hopefully when you run the form, the form will still be fullscreen but the AxWMPLib won't cause it to go wrong, and everything should be anchored correctly.

wxWidgets pprogrammaticaly move to next input control

I originally had code that set the focus to the first widget in a dialog, in the onInit method. But there were problems with it: if I pressed TAB, indeed focus moved to next control (wxTextCtrl), which got the blue 'focus' color, but the 'focus' color/highlight was not removed from previous focus widget. So now it looked like both first and second control had focus at the same time...
When cycling manually (by pressing TAB) full circle (till last control and then wrap around to the first), suddenly all worked well. That is, when moving focus from first control to next one, the first visually lost focus (blue color was removed) as it should. From now on, only one item had the focus color/highlight.
So instead of setting focus on the first control, I tried a different approach: I set the focus to the last control in the dialog, which is always the OK button. Next, I want to emulate programmatically that a TAB is pressed and received by the dialog. So I wrote this (inside Dialog::onInit):
m_buttonOK->SetFocus();
wxKeyEvent key;
key.SetEventObject(this);
key.SetEventType(wxEVT_CHAR);
key.m_keyCode=WXK_TAB;
ProcessWindowEvent(key);
Now the focus indeed moves away from the OK button, but it does not wrap around to the first control.
Only when I manually press TAB after the dialog opened, the first item gets focus.
Question: why does this wrapping around to set focus on first widget not work with the code shown above?
First of all, your initial problem is almost certainly related to not calling event.Skip() in one of your event handlers, see the note in wxFocusEvent documentation.
Second, you can't send wx events to the native windows, they don't know anything about it. In this particular case you can use wxWindow::Navigate() to do what you want, but generally speaking what you're doing simple can't, and won't, work reliably.

How to emulate mouse position in FireFox?

I'm trying to figure a lot of hover/mouseover related CSS/Javascript on a webpage.
To do so, I use Firefox+firebug inspectors.
The problem, is that whenever I move the mouse out of an element I'm inspecting, all the "hover reactions" are lost.
Is there a way, to fix the mouse position firefox sees so I can freely use the mouse withouth concern about weiter it actually hovers some elements or not?
Well, it is not fixing the mouse position, but when you right-click on an element in the Inspector in the regular Developer Tools, you're offered a :hover menu item (along some other things). Selecting that will put the element into permanent :hover state. That at least should cover the CSS-part of your question. I'm sure Firebug offers something similar.
For the JS-part, I'd just set a breakpoint somewhere.

is there a trick to working with multiple visual studio panel objects at design time

Is there some sort of shortcut key that I am missing here for swapping panels around in the form editor of vs2010?
I have numerous panels which are swapped at runtime according to an enum "toggle" value and the only way I seem to be able to move them back and forth is to make one panel smaller than another and right click it. Half the time I end up selecting some other object in the action of trying to right my panels.
I figured there must be something i'm missing here.
there are icons on the layout toolbar for this task. I pick the panel in properties and move it around with those. Way easier than right clicking and hoping for the best.
edit: although sometimes the buttons are not enabled when you need them to be. Still right clicking a resize handle adorner dot will pop up the context menu where you can then choose to move back/forward.
I still wish there was some key combo I could press. Hitting the 4px of display area that the adorner dot occupies on my screen is sort of a dexterity test of sorts and slows me down.

GTK - Don't highlight buttons on select / hover

I'm trying to write a kiosk GUI in ruby/gtk on ubuntu. I'm pretty fluent in ruby, but new to writing GUIs and not great with linux.
I'm using a touch screen, and am using our own images for buttons, e.g.
button_image = Gtk::Image.new(Gdk::Pixbuff.new "images/button_image.png")
#button = Gtk::Button.new
#button.add(button_image)
#button.set_relief(Gtk::RELIEF_NONE)
My issue is that when the buttons are pressed or remain selected (or hovered over, although this is less relevant with a touch screen), gtk shows fat, square borders around them. Obviously it's applying gtk's prelight / selected / active lighting to the buttons. I've tried changing the button properties in various ways, and also tryied hacking apart my theme, and while I can modify how the highlighting looks, I can't seem to completely get rid of it. Changing the color of the highlight via my theme is easy, but if I remove my setting there's still a default I can't get rid of.
Does anyone know if there's a way to stop it, or possibly make it transparent? Thanks in advance!
Sounds like you want to use exactly your image for the whole button, instead of putting an image inside the normal GtkButton - but still use all the normal behavior of the button.
The easiest way to do this is to just override the drawing. If you are on gtk2, connect to the "expose-event" signal, do your drawing there, and return true so that the default handler doesn't get run. If you are on gtk3, connect to the "draw" signal and do the same.
I tried meddling with the drawing as Federico suggested, but found that the most direct way to address this was instead to use an event box rather than a button. Event boxes accept clicks just like buttons, but don't respond to selecting, hovering, etc. In ruby, the code looks like this:
image = Gtk::Image.new("myfile.png")
event_box = Gtk::EventBox.new.add(image)
event_box.visible_window = false
event_box.signal_connect("button_press_event") do
puts "Clicked."
end
Most of this is exactly like a button; the *visible_window* method, obviously, keeps the event box from being visible under the button image.

Resources