Detect tap in page? - windows-phone-8

I have a PhoneApplicationPage with some grids, images and a few buttons. If I tap outside my buttons, anywhere in the page (on an image, grid or whatever), I want to open a new page.
How can I detect a tap/click anywhere on the page?

I see at least two ways to do that:
Listen to the MouseLeftButtonUp event on your PhoneApplicationPage. It should be triggered by images and labels but not by buttons
Listen to the Tap event on your PhoneApplicationPage. However, this event will be triggered even when the user tap on a button. To prevent this, you can retrieve the list of controls at the tap coordinates in the event handler, and open the new page only if there's no button:
private void PhoneApplicationPage_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
var element = (UIElement)sender;
var controls = VisualTreeHelper.FindElementsInHostCoordinates(e.GetPosition(element), element);
if(controls.OfType<Button>().Any())
{
return;
}
// Open the new page
}

Related

Minimize a resizable JDialog

I'm working on an swing application with a main window (which extends JFrame) from which several child windows can be opened (more than 1 contemporarily).
These windows are all non-modal and resizable.
So far, I implemented these 'child' windows as a JFrame. However, I get a new icon on my Windows taskbar for each opened Window.
I therefore tried to implement these windows as a JDialog with type ModalityType.MODELESS.
Looks OK except that a JDialog has no minimize button.
Is there a way to resolve this?
I.e., I need to create non-modal and resizable child windows that can be minimized.
JInternalFrame is not an option since the main frame is not just a container with a JDesktopPane and child windows should be able to cross the borders of the main window.
For those interested:
Child windows register and unregister themselves on the main window when being opened/closed.
The main window has a menu with a 'Windows' item and child windows are added/removed from that menu upon registration/unregistration.
The user can switch between the various windows by selecting an item within this menu.
I am offering two suggestions.
A. Don't use the close button to get rid of the contents.
B. Set the type of child jframes to be utility.
I think having the JDialog close button destroy data is setting your users up for data loss. I would instead use the close to just hide the window, and then have controls inside of the dialog to cancel/finish/restart.
import java.awt.*;
public class DiFrame{
static JDialog log;
static JFrame ame;
public static void main(String[] args){
JFrame frame = new JFrame("Father of two");
JButton one = new JButton("dialog");
one.addActionListener( evt->{
if(log==null){
log = new JDialog(frame, "dialog child", false);
log.add(new JTextArea("fresh start"));
log.pack();
log.setVisible(true);
} else{
log.setVisible(true);
}
});
JButton two = new JButton("frame");
two.addActionListener( evt->{
if(ame==null){
ame = new JFrame("frame child");
ame.add( new JTextArea("fresh start") );
ame.setType(Window.Type.UTILITY);
ame.pack();
ame.setVisible(true);
} else{
ame.setVisible(true);
}
});
frame.add(one, BorderLayout.NORTH);
frame.add(two, BorderLayout.SOUTH);
frame.pack();
frame.setVisible(true);
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
}
}
Click the dialog button and it shows the dialog. Then the text area can be modified. When the dialog is closed it can be re-opened.
Click the frame button and a jframe is shown. ( I actually cannot check if this shows up as a new application because it doesn't on my computer anyways. )

InputPane does not work correctly

I'm currently developing an Universal Application, but here is a problem. I have a Frame with the TextBox for User Phone Number.
So, I want to change the height of my LayoutRoot (GRID) so it can fits in the free space.
I'm using InputPane.GetForCurrentView().Showing and InputPane.GetForCurrentView().Hiding for that purposes.
Here is my code.
public UserRegistrationAuthorization_PhoneNumber()
{
this.InitializeComponent();
LayoutRootInitialHeight = LayoutRoot.ActualHeight;
InputPane.GetForCurrentView().Showing += UserRegistrationAuthorization_PhoneNumber_Showing;
InputPane.GetForCurrentView().Hiding += UserRegistrationAuthorization_PhoneNumber_Hiding;
}
private void UserRegistrationAuthorization_PhoneNumber_Showing(InputPane sender, InputPaneVisibilityEventArgs args)
{
LayoutRoot.Height = LayoutRoot.ActualHeight - args.OccludedRect.Height;
LayoutRoot.VerticalAlignment = VerticalAlignment.Top;
args.EnsuredFocusedElementInView = true;
}
private void UserRegistrationAuthorization_PhoneNumber_Hiding(InputPane sender, InputPaneVisibilityEventArgs args)
{
// TODO: Get rid of that shit
LayoutRoot.Height = LayoutRootInitialHeight;
args.EnsuredFocusedElementInView = false;
}
When I click outside the TextBox keyboard hides and leaves after that a black hole on the screen. 2
But, the most interesting is that when I press that physical Back Button on my Lumia, keyboard hides normally and my LayoutRoot gets the Frame's initial height.
Is it a bug or I'm doing something wrong?
It happens because by the time you saving your LayoutRootInitialHeight in the constructor, LayoutRoot actually isn't loaded and it's ActualHeight == 0. Then you setting LayoutRoot.Height to 0, so it becomes not visible. So you should probably save your LayoutRootInitialHeight in LayoutRoot's Loaded event handler.
I would also suggest you not to change LayoutRoot's height at all. It causes your whole visual tree to be rendered from scratch and it's bad practise in general. Instead, modify RenderTransform of all necessary elements so they get moved to appropriate positions. RenderTransform is the right way to handle movements and animations on the screen, and you can achieve some nice visual effects with Next button moving up same as keyboard.
Roughly your code can look like this:
<Button Content="Next" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center">
<Button.RenderTransform>
<CompositeTransform x:Name="NextButtonTransform" TranslateY="0"/>
</Button.RenderTransform>
</Button>
...
private void UserRegistrationAuthorization_PhoneNumber_Showing(InputPane sender, InputPaneVisibilityEventArgs args)
{
NextButtonTransform.TranslateY = -300;
EnsuredFocusedElementInView = true;
}
private void UserRegistrationAuthorization_PhoneNumber_Hiding(InputPane sender, InputPaneVisibilityEventArgs args)
{
NextButtonTransform.TranslateY = 0;
args.EnsuredFocusedElementInView = false;
}
And more complicated way is to run some storyboard which makes your Next button move up and down in same speed with keyboard, always appearing on top of it. Although, since InputPane.GetForCurrentView().Showing gets fired after keyboard already shown fully, you should hook up all animations to TextBox.GotFocus and TextBox.LostFocus events. On mobile, keyboard is always shown when text box has focus, so it will work nicely.

How do I remove focus from a button, so that pushing the spacebar or Enter doesn't trigger the button?

When you click or tap a button, it gives it focus, so that when you push the spacebar or Enter, it triggers the button again. I don't want that to happen.
I tried this: button1.Focus(Windows.UI.Xaml.FocusState.Unfocused);
But the unwanted behavior still happens (pushing the spacebar or Enter triggers the button again). I also tried setting focus to another button using the Programmatic and Keyboard FocusStates but that doesn't fix it either.
Any help, especially an explanation of why this is happening, would be greatly appreciated.
You can set the TabStop property to False, but be aware that doing this disallows user from using the button by keyboard.
<Button Content="Click Me By Pointer!" IsTabStop="False"/>
Update
As msdn states:
You can't remove focus from a control by calling this method with FocusState.Unfocused as the parameter. This value is not allowed and causes an exception. To remove focus from a control, set focus to a different control.
So another way to achieve this, is setting focus to previously focused element when the button is about to get focus by pointer. Unfortunatly the GettingFocus event is not working for the Button class (maybe because final version is not released yet?) so we should use GotFocus event, it's ugly it but works.
bool moveFocus = false;
public MainPage() {
this.InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e) {
if (moveFocus) {
UIElement focusedElement = FocusManager.FindNextFocusableElement(FocusNavigationDirection.Right);
if (focusedElement is Control) {
((Control)focusedElement).Focus(FocusState.Programmatic);
}
}
}
private void Button_GotFocus(object sender, RoutedEventArgs e) {
Button button = (Button)sender;
moveFocus = (button.FocusState == FocusState.Pointer);
}
Note that I passed FocusNavigationDirection.Right to FocusManager.FindNextFocusableElement to get an element in right, I should have used FocusNavigationDirection.Previous instead to get previous element but it returns null for unknown reason.

How to change images

I am developing simple windows phone 8 application. I want to play a song in it so after clicking on play button song should play and the image on play button should change to pause button.clicking on pause song should pause and images change to play button.. How to change the images?
You can consider to have two buttons one with play image and the other with the pause image and switch the visibilty of the buttons depending upon your needs, like when the song is not playing display the button with play image and when the song is playing collapse the play button and make the pause button visible. This not the solution you want to know just another way of doing it for your the solution you seek i'll need to know how you are setting the image on the play button.
Edit
there's a visibilty property in every control, by default the visibilty of a button is set to "Visible", if your buttons are named controls then you can access the buttons from your "code behind" in your click or tap events for the respective buttons
Suppose here the XAML for your buttons
<Button x:Name="PlayButton" Click="PlayButton_Click" Visibility="Visible"/>
<Button x:Name="PauseButton" Click="Pause_Click" Visibility="Collapsed"/>
Here is the code behind for the events attched
private void PlayButton_Click(object sender, RoutedEventArgs e)
{
PlayButton.Visibility = Visibility.Collapsed; //Collapse the Play Button
PauseButton.Visibility = Visibility.Visible; // Make Pause Button visible
/*your code for play here*/
}
private void Pause_Click(object sender, RoutedEventArgs e)
{
PlayButton.Visibility = Visibility.Visible; //Make Play Button Visible
PauseButton.Visibility = Visibility.Collapsed; //Collapse Pause Button
/*your code for pause here*/
}
Try this. It helps you
<Image Source="Your play button source" MouseLeftButtonUp="imgPlayPause_MouseLeftButtonUp" x:Name="imgPlayPause"/>
In code behind take a global vaiable
bool IsPlay = false;
private void imgPlayPause_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
if(!IsPlay)
{
IsPlay = true;
imgPlayPause.Source = Your Pause image source
//Set Bitmap Image as Image Source
plyaSong functionality
}
else
{
IsPlay = false;
imgPlayPause.Source = Your play image source
//Set Bitmap Image as Image Source
pause song functionality
}
}

html body gwt click event

html file has two textbox and one button.
but i need to generate click event when i only click outside of the two textboxes and button
element.how can i do that.
RootPanel.get().addEventListener or something like that?? help.
Typing anywhere in the browser window will trigger alert pop-up:
Event.addNativePreviewHandler(new Event.NativePreviewHandler() {
#Override
public void onPreviewNativeEvent(NativePreviewEvent event) {
NativeEvent ne = event.getNativeEvent();
if (KeyDownEvent.getType().getName().equals(ne.getType())) {
Window.alert("who fired me last?"
+ event.getNativeEvent().getCurrentEventTarget()
+ "\nevent target:" + event.getNativeEvent().getEventTarget());
}
}
});
I don't know, if RootPanel.get().addEventListener works, but you can add another panel, which contains the three elements. To the new panel you can add an listener.