How to handle Tap event from Hold Event in WindowsPhone8? - windows-phone-8

I have a usercontrol and tap event which is in usercontrol itself..And am having holding event for that usercontrol in phoneapplication page which is parent page.I want to raise tap event from hold event how do i achieve this?..
ParentPage is having:
<DataTemplate x:Key="template" >
<chatbubble:ChatBubbleControl x:Name="ChatBubble" Hold="ChatBubbleControl_Hold_1" />
</DataTemplate>
UserControl is having..
<UserControl.Resources>
....
<Grid x:Name="LayoutRoot" Background="Transparent" Width="455" Tap="chatBubble_Tap" >
.....
</Grid>
I want to raise chatBubble_Tap event from ChatBubbleControl_Hold_1

You can try to raise your event like this:
// make your eventhandler in Parent Page public and static so it will be available thru all the App
public static void chatBubble_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
// your code
}
// then in your UserControl you should be able to call it like this:
private void ChatBubbleControl_Hold_1(object sender, System.Windows.Input.GestureEventArgs e)
{
YourPage.chatBubble_Tap(sender, e);
}
This case depends on what you have in your Tap event (not everything can be in static method).
You can also pass the handler of your Page to your UserControl and then invoke your Tap event from handler (in this case the Tap event can be public (non-static). Simple case can look like this:
// your Control in MainPage (or other Page)
<local:myControl x:Name="yourControl" VerticalAlignment="Center" Grid.Row="1"/>
// initializing control and event to be invoked:
public MainPage()
{
InitializeComponent();
yourControl.pageHandler = this;
}
public void second_Click(object sender, RoutedEventArgs e)
{
// something here
}
// and the control code:
public partial class myControl : UserControl
{
public Page pageHandler;
public myControl()
{
InitializeComponent();
myButton.Hold +=myButton_Hold;
}
private void myButton_Hold(object sender, System.Windows.Input.GestureEventArgs e)
{
if (pageHandler is MainPage) (pageHandler as MainPage).second_Click(sender, e);
}
}
The third option would be to pass an Action to your Control (in this case event can be private):
// code in MainPage (or your Page)
public MainPage()
{
InitializeComponent();
yourControl.myAction = second_Click; // setting an action of Control
}
private void second_Click(object sender, RoutedEventArgs e)
{
// something here
}
// and the Control class
public partial class myControl : UserControl
{
public Action<object, System.Windows.Input.GestureEventArgs> myAction;
public myControl()
{
InitializeComponent();
myButton.Hold +=myButton_Hold;
}
private void myButton_Hold(object sender, System.Windows.Input.GestureEventArgs e)
{
if (myAction != null) myAction.Invoke(sender, e);
}
}

Related

How to add progress bar or progress ring for webview project for windows mobile app

I have created a Webview Project for windows phone app to load google.com. It's working fine but I'm unable to add a Progress bar or Progress Ring. Can any one please help me?
namespace App2
{
public sealed partial class MainPage : Page
{
private static readonly Uri HomeUri = new Uri("http://www.google.com", UriKind.Absolute);
public MainPage()
{
this.InitializeComponent();
this.NavigationCacheMode = NavigationCacheMode.Required;
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
WebViewControl.Navigate(HomeUri);
HardwareButtons.BackPressed += this.MainPage_BackPressed;
}
protected override void OnNavigatedFrom(NavigationEventArgs e)
{
HardwareButtons.BackPressed -= this.MainPage_BackPressed;
}
private void MainPage_BackPressed(object sender, BackPressedEventArgs e)
{
if (WebViewControl.CanGoBack)
{
WebViewControl.GoBack();
e.Handled = true;
}
}
private void Browser_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
{
if (!args.IsSuccess)
{
Debug.WriteLine("Navigation to this page failed, check your internet connection.");
}
}
}
}
In your XAML add a progress ring over the webview so that it overlaps webview for example
<Grid>
<Grid x:Name="webViewHolder" >
<WebView x:Name="wvPage" Loaded="WebView_Loaded" NavigationCompleted="WebView_NavigationCompleted" NavigationStarting="wvPage_NavigationStarting"></WebView>
</Grid>
<ProgressRing x:Name="myProgressRing" IsActive="True" Height="90" Width="90" Background="Transparent" Foreground="#EF4D17"/>
</Grid>
Now in code Behind
private void wvPage_NavigationStarting(Windows.UI.Xaml.Controls.WebView sender, WebViewNavigationStartingEventArgs args)
{
myProgressRing.IsActive = true;
}
.
.
.
private void WebView_NavigationCompleted(Windows.UI.Xaml.Controls.WebView sender, WebViewNavigationCompletedEventArgs args)
{
myProgressRing.IsActive = false;
}

Bind an Action to a property of a UserControl in XAML

I have a user control which has a button and a dependency property for the action the button is to execute. The page which contains the control sets the action in XAML.
MyUserControl.cs
A Button, and dependency property ButtonAction, of type Action. When the button is clicked it executes the ButtonAction.
MainPage.xaml.cs
Action Action1
Action Action2
MainPage.xaml
Present an instance of MyUserControl, with ButtonAction=Action1
The problem: The ButtonAction property is not assigned from the XAML
MyUserControl.cs
public sealed partial class MyUserControl : UserControl
{
public Action ButtonAction {
get { return (Action)GetValue(ButtonActionProperty); }
set { SetValue(ButtonActionProperty, value); }
}
public static readonly DependencyProperty ButtonActionProperty =
DependencyProperty.Register("ButtonAction", typeof(Action), typeof(MyUserControl), new PropertyMetadata(null,ButtonAction_PropertyChanged));
private static void ButtonAction_PropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) {
Debug.WriteLine("ButtonAction_PropertyChanged");
// Is not called!
}
public MyUserControl() {
this.InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e) {
if (ButtonAction != null) {
// Never reaches here!
ButtonAction();
}
}
}
MyUserControl.xaml
<Grid>
<Button Click="Button_Click">Do The Attached Action!</Button>
</Grid>
MainPage.xaml.cs
Action Action1 = (
() => { Debug.WriteLine("Action1 called"); });
Action Action2 = (() => { Debug.WriteLine("Action2 called"); });
MainPage.xaml
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<local:MyUserControl x:Name="myUserControl" ButtonAction="{Binding Action1}"/>
</Grid>
It does work if in the code-behind for MainPage (MainPage.xaml.cs) I assign the action in the Loaded event.
private void Page_Loaded(object sender, RoutedEventArgs e) {
this.myUserControl.ButtonAction = Action1;
}
In this case the PropertyChanged callback in the user control is also called. (This handler is provided only for diagnostic purposes. I can't see how it can be used to support the property in practice).
The issue is in your data binding. The Action1 in ButtonAction="{Binding Action1}" should be a public property while you defined it as a private variable.
Also, you cannot just declare a normal property directly in the code behind like that. You will need either a dependency property, or more commonly, a public property inside a viewmodel which implements INotifyPropertyChanged.
If we go with the second approach, we will need to create a viewmodel class like the following with an Action1 property. Note the OnPropertyChanged stuff is just the standard way of implementing INotifyPropertyChanged.
public class ViewModel : INotifyPropertyChanged
{
private Action _action1;
public Action Action1
{
get { return _action1; }
set
{
_action1 = value;
OnPropertyChanged("Action1");
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string name)
{
var handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(name));
}
}
}
And then you just need to assign this to the DataContext of your main page.
public MainPage()
{
this.InitializeComponent();
var vm = new ViewModel();
vm.Action1 = (() =>
{
Debug.WriteLine("Action1 called");
});
this.DataContext = vm;
}
With these two changes, your ButtonAction callback should be firing now. :)

How to add timer to change image for selected item in ListPicker

what would be the steps to add timer to change selected item's image in listpicker. Any suggestions? FYI, have never used ListPicker before. So i am finding it kind of hard to understand where to start and what to do.
You will need an ObservableCollection of your ImageSources and a DispatcherTimer to fire the events every TimeSpan of your choosing.
Here's some code to help you get started. You can modify it to do exactly what you want. It basically contains a ListPicker that has a collection of images as its ItemTemplate. Every one second the DispatchTimer fires and switches the selectedItem's Image between the 2 default images that are created in about every single WP8.0 application.
Make it a habit to use ObervableCollection when you want to display something to the user instead of a List, it will make your WP8 development life a lot easier.
XAML
<toolkit:ListPicker x:Name="my_listpicker" SelectionChanged="my_listpicker_SelectionChanged_1" Background="Black">
<toolkit:ListPicker.HeaderTemplate>
<DataTemplate/>
</toolkit:ListPicker.HeaderTemplate>
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel Background="Black">
<Image Source="{Binding ImageSource}" Height="200"></Image>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
</toolkit:ListPicker>
C# Namespaces
using System.ComponentModel; // ObservableCollection
using System.Collections.ObjectModel; // INotifyPropertyChanged
using System.Windows.Threading; // Dispatch Timer
C# Model of your Images (pretty basic, but pay attention to the INotifyPropertyChanged
public class MyBindingImage : INotifyPropertyChanged
{
public MyBindingImage() { }
public MyBindingImage(string source)
{
this.ImageSource = source;
}
// Create the OnPropertyChanged method to raise the event
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged(string name)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
{
handler(this, new PropertyChangedEventArgs(name));
}
}
string image_source;
public String ImageSource {
get { return image_source; }
set
{
image_source = value;
OnPropertyChanged("ImageSource");
}
}
}
C# (Create the Timer and ObservableCollection and Set the ItemSource)
DispatcherTimer timer;
// Constructor
public MainPage()
{
// create our dispatch timer
timer = new DispatcherTimer();
timer.Interval = TimeSpan.FromMilliseconds(2000);
timer.Tick += OnTimerTick;
InitializeComponent();
// create our list picker elements
ObservableCollection<MyBindingImage> my_image_list = new ObservableCollection<MyBindingImage>();
my_image_list.Add(new MyBindingImage("Assets/ApplicationIcon.png"));
my_image_list.Add(new MyBindingImage("Assets/AlignmentGrid.png"));
my_listpicker.ItemsSource = my_image_list;
}
C# Events (For the Timer & ListPicker SelectionChange)
// each time the selection has changd: stop the timer, then start it again
private void my_listpicker_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
{
if (timer != null)
{
timer.Stop();
timer.Start();
}
}
// if the timer is on, cycle the images of the selected item
private void OnTimerTick(object sender, EventArgs e)
{
try
{
MyBindingImage item = (MyBindingImage) my_listpicker.SelectedItem;
// cycle the selected image between to different images
if (item.ImageSource == "Assets/AlignmentGrid.png")
{
item.ImageSource = "Assets/ApplicationIcon.png";
}
else
{
item.ImageSource = "Assets/AlignmentGrid.png";
}
}
catch (Exception ex)
{
string error_message = ex.Message;
}
}
[APPLICATION SCREENSHOT]

caliburn winrt usercontrol and capturing custom event

I made my own slider as user control with some custom properties and one custom event. Everything works fine, but recently I start using Caliburn Micro, and I don't know how to capture my custom event.
Previously I used:
<my:RadialSlider x:Name="slider" WedgeAngle="270" ..... AngleChanged="slider_AngleChanged" />
and
public void slider_AngleChanged(object sender, ValueChangedEventArgs e)
{
.... something ....
}
Now, in Caliburn project I tried:
<my:RadialSlider x:Name="slider" WedgeAngle="270" ..... cal:Message.Attach="[Event AngleChanged] = [Action slider_AngleChanged($eventArgs)]" />
and in my ViewModel:
public void slider_AngleChanged(object sender, ValueChangedEventArgs e)
{
.... something ....
}
But, this doesn't work...
So, how to capture this event?
Slider UC code-behind:
public delegate void AngleChangedEventHandler(object sender, ValueChangedEventArgs e);
public sealed partial class RadialSlider : UserControl
{
public event AngleChangedEventHandler AngleChanged;
private void OnAngleChanged(ValueChangedEventArgs e)
{
if (AngleChanged != null)
AngleChanged(this, e);
}
public static readonly DependencyProperty WedgeAngleProperty = DependencyProperty.Register("WedgeAngle", typeof(double), typeof(RadialSlider), new PropertyMetadata((double)270, new PropertyChangedCallback(OnPropertyWedgeAngleChanged)));
public double WedgeAngle
{
get { return (double)this.GetValue(WedgeAngleProperty); }
set { this.SetValue(WedgeAngleProperty, value); }
}
private static void OnPropertyWedgeAngleChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
{
(sender as RadialSlider).UpdateControls();
if (e.NewValue != e.OldValue)
{
(sender as RadialSlider).OnAngleChanged(new ValueChangedEventArgs((double)e.OldValue, (double)e.NewValue));
}
}
}
You need to use a routed event. This has to do with how events bubble up the visual tree and how Caliburn.Micro attaches itself to them. Standard events should be avoided on controls or UI widgets in any tech using Xaml as the loose out on some pretty funky features (bubble up / down).

JPopupMenu doesn't dissapear/move when minimising/moving the JFrame it is in

I am making an mp3 player, with several JLists in my JFrame. When I right click on a JList item, a popup with some options for that song appears. But when this popup is visible, and I minimise my JFrame, this popup stays visible! Also, when the popup is visible, and I drag my JFrame to somewhere else on the screen, the popup stays on it's original position (so it does not stay on the same position relative to the JFrame)... Can someone please help me out with this? I tried to strip down this class as much as possible :)
I would be really grateful if someone could help me out !!
Joe
public class playListPanel extends JPanel implements MouseListener {
private DefaultListModel model;
private Interface interFace;
private JList list;
private boolean emptyPlaylist;
private ArrayList<Song> currentPlayList;
private Song rightClickedSong;
private JPopupMenu popup;
private Point panelLocation;
public playListPanel(Interface interFace) // Interface extends JFrame,
// playListPanel is a part of
// this JFrame.
{
this.interFace = interFace;
this.panelLocation = new Point(559, 146);
setBackground(SystemColor.controlHighlight);
setBorder(new TitledBorder(null, "", TitledBorder.LEADING,
TitledBorder.TOP, null, null));
setBounds((int) panelLocation.getX(), (int) panelLocation.getY(), 698,
368);
setLayout(null);
currentPlayList = new ArrayList<Song>();
model = new DefaultListModel();
list = new JList(model);
list.setVisible(true);
list.addMouseListener(this);
JScrollPane scrollPane = new JScrollPane(list);
scrollPane.setBounds(5, 5, 688, 357);
add(scrollPane);
emptyPlaylist = true;
}
private void openMenuPopup(Point point)
{
removePopup();
popup = new JPopupMenu();
int x = (int) point.getX();
int y = (int) point.getY();
popup.setLocation((int) (x+panelLocation.getX()),(int) (y+panelLocation.getY()));
//popup.setLabel("popup voor playlist");
JMenuItem removeSong;
popup.add(removeSong = new JMenuItem("Remove Song from Playlist", new ImageIcon("image.jpg")));
ActionListener menuListener = new ActionListener()
{
public void actionPerformed(ActionEvent event)
{
if(event.getActionCommand().equals("Remove Song from Playlist"))
{
System.out.println("Remove Song from Playlist");
interFace.getPlaylistManager().removeOneSong(rightClickedSong);
removePopup();
}
};
//ADD THE LISTENERS TO THE MENU ITEMS
removeSong.addActionListener(menuListener);
popup.setVisible(true);
}
public void removePopup()
{
if(popup!==null)
{
popup.setVisible(false);
System.out.println("popup removed");
}
}
private int getRow(Point point) {
return list.locationToIndex(point);
}
public void refreshPlayList(ArrayList<Song> playlist) {
this.currentPlayList = playlist;
model.clear();
for (Song song : playlist) {
model.add(model.getSize(), song.getPlaylistString());
}
list.setVisible(true);
}
public void highlightSong(int index) {
list.setSelectedIndex(index);
}
public int getRowOfList(Point point) {
return list.locationToIndex(point);
}
#Override
public void mouseClicked(MouseEvent e) {
interFace.getPlaylistManager().doubleClickOnPlaylist(e);
}
#Override
public void mouseEntered(MouseEvent arg0) {
}
#Override
public void mouseExited(MouseEvent arg0) {
}
#Override
public void mousePressed(MouseEvent e) {
if (SwingUtilities.isRightMouseButton(e)) {
rightClickedSong = currentPlayList.get(getRow(e.getPoint()));
openMenuPopup(e.getPoint());
System.out.println("should open popup at "
+ e.getPoint().toString());
}
}
#Override
public void mouseReleased(MouseEvent arg0) {
}
}
There are some basic flaws in the way you are handling click for showing popup.
It is not advisable to call popup.setVisible in simple scenarios like this. Instead, you may rely on its default behavior. Also, better to use e.isPopupTrigger() than to check SwingUtilities.isRightMouseButton(e) to show popup.
You may do something like the following :
//at classlevel,
private JPopupMenu popup = new JPopupMenu();
//create a Popuplistener
PopupListener pl = new PopupListener();
list.addMouseListener(pl);
//Implementation of your popuplistener
class PopupListener extends MouseAdapter {
public void mousePressed(MouseEvent e) {
maybeShowPopup(e);
}
public void mouseReleased(MouseEvent e) {
maybeShowPopup(e);
}
private void maybeShowPopup(MouseEvent e) {
if (e.isPopupTrigger())
//e.getSource - and construct your popup as required.
//and then.
popup.show(((JApplet) e.getComponent()).getContentPane(), e
.getX(), e.getY());
}
}