WinRT - ImageButton for transparent PNGs - xaml

I'm using XAML Toolkit ImageButton control to be able to create normal and pressed states for a button. Code is:
<toolkit:ImageButton NormalStateImageSource="ms-appx:///Assets/1_off.png"
PressedStateImageSource="ms-appx:///Assets/1_on.png"
Width="500"
Height="200">
</toolkit:ImageButton>
Issue I'm facing is, say I have a shape which isn't rectangle or square. For example I have PNGs for star and arrow object. Is there a way to set their boundary corresponding to shape? If not, please advice the best approach to handle such scenarios.

There are two options I tried
When clicking using mouse or touch - you'd check the last position of the pointer before click and see if the image in your button has a non-transparent pixel at that position.
Pros:
It's simpler than option 2.
You get most precise information
Cons:
You can't tell if a button got clicked with mouse, touch, pen, keyboard or by narrator using automation, so you could end up filtering out keyboard clicks just because the mouse cursor is a bit off. You could possibly use some heuristics like how long ago was the pointer move or pointer down event before the click event, but it's a bit hacky and might be unreliable.
Generate a vector path for your image and put it in the button template as a Path element with Fill="Transparent", then mark any other non-transparent or hit testable template elements (buttons, borders with Background="Transparent", etc.) as IsHitTestVisible="false".
Pros:
Doesn't break any input methods
Can be quite precise
For some shapes like a circle - the Path.Data could be quite simple or you could even use something like an Ellipse element instead
Cons:
You need to generate the path somehow
A complex path might adversely affect performance
A better solution overall in most cases is to leave the hit-testable area rectangular. The reason is - an arbitrary shape is a finicky and unreliable hit test target so it makes clicking your button more difficult. Using the default rectangular border or at most - an ellipse shape is a lot simpler and more usable.

Related

Displaying overlayed QGraphicsItems

I have developed an application in PyQt5 that displays an image and allows the user to pan the image using the mouse and zoom using the mouse wheel. I now need to add the functionality to show popup text associated to specific parts of the displayed image. While painting the text directly on to the QGraphicsScene is a possibility, the range of zooms that are commonly used means that the text will be much too small when zoomed out, or much too large when zoomed in.
I would like to achieve a way of placing the QGraphicsTextItem widgets at a static location that is not affected by the pan and zoom. This way, they can be statically located around the perimiter of the QGrapicsView, and I can draw a line from the text box to the position in the scene. My problem is that I cannot find a way to place the text items so they are independant of the QGraphicsScene. I am thinking that I should have the text items external to the scene, and place the QGraphicsView and any text boxes in a parent QObject. I cannot figure out if this is the best method, and have had limited success with trying to connect a line from QGraphicsElipsesItem that marks the position on the image, to a QLabel in the parent QObject.
I hope I have made this clear enough. Please comment if it needs more clarification.

How to expand wxTextCtrl in wxToolbar?

There is a tool button and a textctrl in the toolbar. I'm trying to expand the textctrl in the horizontal direction to fill all the remaining space.
wxSizer maybe a good choice but it seems not suitable with toolbar because I can't add tool button directly in a sizer.
There is no built in support for this, you will need to handle wxEVT_SIZE (either in the toolbar itself or in the frame containing it, as the size of the toolbar only changes when the size of the frame does), compute the available size (which is going to be tricky, there is no function to find this out neither so I expect you'd have to do some kind of binary search using wxToolBar::FindToolForPosition()) and resize your text control.
It would definitely be much simpler to put both the toolbar and the text in a sizer instead. But it's true that it wouldn't appear quite the same, so if you really want to have the text-inside-toolbar appearance, you would have to do the above. Good luck!

Want To Create A Floating Speech Bubble Form

Wondering if someone could help me....
I have a small .NET application where I have an Edit button on a main form. When the user clicks the Edit button, I want to popup a small form right next to it (on top of the main form) with a speech balloon tail attached on the side of the form pointing to the Edit button. So it gives the effect of a floating form pushed out from the Edit button.
I don't want the appearance of a normal speech bubble, I want it to look like an actual borderless form (with square corners). It could be a custom control or anything (however, I am not yet familiar with creating my own custom controls), but I need to add Text Controls, Pictures, Label Controls, etc. to this floating form.
Any help would be appreciated.
Thanks
UPDATE
I am trying to create something to this affect:
So imagine the ? being the Edit button and the other being a form with custom controls.
Like this?
To get this behavior:
Select an image which will represent your speech bubble. Put a PictureBox on the form, make it use this image. Place two labels, as above, adjust the font.
Pick your transparency key (color). Your image background and form background need to be set to that. I used black for demo purposes, which is a bad choice if you plan to have any black or text in your speech bubble. Set form's TransparencyKey property to this color in designer. More about TransparencyKey on MSDN.
(final step, not shown on the screenshot). Set FormBorderStyle = None.
Also make sure you have other ways to close your bubble, because X will be unavailable.
The final result may look something like the following:
Note: You may notice some drawing artifacts, most images on the internet have smooth borders, and transparency key does not support shades, has to be exact color. If you are fine with these minor artifacts, feel free to leave it at that. Or, edit it to get rough borders. Or find another one that better suits your needs.

How to make an object invisible at a particular keyframe without moving it in Blender (2.59)?

I'm quite new to blender, and I'm doing some experiments with it.
I've been searching for a way to make an object disappear from sight at a particular key-frame, without moving it out of the camera view. E.g. at frame 1, cube is there, at (0, 0, 0) and at frame 2, it's not visible anymore, but still there at position (0,0,0), at frame 3 it gets visible again.
After searching the web, I came upon this page which suggests to move the object to another layer, but since it applies to blender 2.49, it seems the software has changed since then: I'm unable to find the 'Layer' option when inserting a key-frame.
I've found some other sites but either they suggest to use a technique similar to the one linked above, or they suggest to change the alpha of the texture, which I'm not interested in.
So, what's the preferred method to make an object invisible in blender 2.59?
Additional information (not relevant for the answer I'm expecting, IMO):
I'm using blender to make models for Unity.
I'm using 2.59 because that's the one that works with the unity version that I have.
There are lots of ways to achieve this effect.
The easiest way is to keyframe the visibility of the object.
To do this, you simply go to the outliner, and click the little eyeball next to your object name, then hover over the closed eyeball and hit "i" to keyframe. The eye will then turn yellow to indicate it's keyframed. Do the same with the camera icon (so that your render behaves the same way). Then go to the point where you want the object to appear, and click the eyball and camera again to make them reappear, then hit "i" again over each to keyframe them... Isn't blender a wonderful program? I love being able to keyframe just about everything! :D
There are also these less easy, but variously useful methods, which you may also use in case you want some sort of transition in your vanishing/appearing:
My perferred way is to just move the opbejct off the screen, keyframe position, then set the animation (in the Graph Editor) curve type to "constant" (Key -> Interpolation Mode -> Constant), and move the object into place and set the keyframe where you want it to appear. It will thus instantaneously appear.
Set the material properties of the object to Transparent, and choose "Z-Transparency" and set alpha to 0. Then simply keyframe the alpha (hover mouse over Alpha value and hit "i"), then go to where you want it to appear, change the alpha value to 1, and keyframe again. This will make it fade in over time, or you can change the curve to constant in the Graph editor, as described in method 1.
If you want to mask the object while it is still in place, you could make a cube around it, set the cube material transparency to "mask", and then move the cube off camera to unmask the object, rather than moving the object. This is handy for when you want to partially unmask something in the course of the animation. For example, if you are creating a text overlay for a video, where you want text to appear as if it's coming out of your hand, you can animate the masked object to follow the contour of your hand as it pulls away to reveal the text.
In Blender 2.65, you can animate the objects visibility toggle in your Outliner panel.
Next to your scene objects there will be three icons: an eye, a cursor, and a camera.
Follow these steps to animate viewport visibility:
Find the object you wish to animate in the Outliner Panel
Mouse over the eye icon and hit "i" on your keyboard to set a keyframe.
Go to the next frame and turn the eye off, then hit "i" moused over it again.
Do the same thing with the camera icon to animate render visibility. I will usually keyframe both the viewport and render visibility icons in tandem so as not to forget to have these toggled when its time to render.
In version 2.9 the eye icon cannot be used to set a keyframe. I've found the best way for me is to use the Object Properties tab and under Transform set the three scale values (X,Y,Z) to zero for invisibility. You can then click the diamond to the right to set the keyframe. To make the object re-appear return the scale values to their original and click on the diamond keyframe icon again.
Obviously you can make it a lot easier for yourself by applying scale to the objects first then just switch them between 0 and 1.
AFAIK there is no easy way to directly set an object invisible in your case. Although the visibility can be animated in Blender (in outline view mive your cursor on the eye and press i) Unity3D doesn't recognise it.
Possible workarounds:
Move it to (1000, 0, 0)
Scale it by a very small value
A more elaborated approach could be to use a driver like when turning FK/IK animation on and off dynamically via a variable.
I found out (today!) that, in Blender 2.8 (& presumably beyond), you can control visibility of objects in animations either in viewports and/or renders. Select the object and, in the Object Properties, open the Visibility section. You will see a dot beside the Viewports and Renders options. Click on the dot in either Viewports or Renders (or both). The relevant boxes should turn green. Either make the object visible or invisible by checking or clearing its box and then click 'i' to insert a keyframe. Repeat the process in other keyframes.
Another way to do this is to make a cube around it and add a boolean modifier to the object you want to disappear, set the operation to difference and select the cube as the modifier's object target. Then turn off the cube's visibility and animate the visibility of the modifier.

Rectangles & Parsing in vb.net

This is kinda....a two part question. The first one is much more important than the second one, both of these are in the same project, and in vb.net.
How can I constrain the bounds of a rectangle object, which is controlled by a mouse, so it cannot be drawn outside a PictureBox? It is kindof a standard lasso control, the user can click and drag and it will draw a box from the initial click point to the mouse's current location. The starting point is at (rectX,rectY), and the box is drawn to the bottom right using rectDimX and rectDimY (to set the width and height) to see how much of a change has occurred with the mouse. Basically, its what you get with a click and drag on a Windows desktop. The issue here is that the rectangle is able to be drawn outside the PictureBox it is being drawn on, and the next part of the code attempts to reference this location, and then fails with an OutOfMemory exception. This leads me to my second question:
How can I make the rectangle draw in more than the fourth quadrant, which is only positive numbers? If it goes anywhere else, it does not show the rectangle, though it does still have the correct values. I know i could code this four times based on starting location and mouse location, but that would be a huge hassle and a rewrite of the whole rectangle code.
Is there an easy solution for either of these? The first one is a much bigger hassle, as it will be very time consuming if there is no easy way.
Thanks for the help!
For the first part of your question, even if the user drags the mouse beyond the edge of your picture box, you don't have to use those coordinates for your drawing routine. Simply do something like
If (DrawingPoint.X > PictureBox.Right)
DrawingPoint.X = PictureBox.Right // Right-hand limit of picture box
End If
And similar for the Y direction.
As for the negative numbers while drawing, you want to translate screen coordinates to client area coordinates. Have a look at ScreenToClient and ClientToScreen.