In Windows phone,How to change checkbox state after questioning user? - c#

In my app,there is a need to do this
At start,the checkbox is unchecked
user tap,and then pop up a messagebox as a alarm to make sure user indeed want to do it(At the moment the checkmark is still collapse)
If user click "Yes,I want to do it",then checkmark is visible and now it is checked
vice versa
I found that,when I tap the checkbox,Checked event is always triggering
and
the checkmark is always turn to "checked" state
How to solve the problem???
Any advice would be great,Thanks!!!

Just a trick is needed. Sharing a sample with you.
overlap a transparent background grid over your checkbox with a transparent background like this.
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<StackPanel>
<Grid>
<CheckBox Name="cb" Content="cb" Checked="CheckBox_Checked_1"/>
<!--Grid that overlaps the checkbox-->
<Grid Background="Transparent" Tap="Grid_Tap_1"/>
</Grid>
</StackPanel>
</Grid>
This overlapping wont call any checkbox event even if you tap on it
now in code of the event
private void Grid_Tap_1(object sender, GestureEventArgs e)
{
if(MessageBox.Show("Message")==MessageBoxResult.Ok)
{
cb.IsChecked=True;
}
}

Instead of Tap Event, Try Checked and Unchecked Events of the checkbox.
Note: You can track the checked status in "Checked" and "UnChecked" events of the Check Box using IsChecked Property and write your code in appropriate events.
After Asking confirmation to user.
If the user clicks "Yes" , set chkBox.IsChecked=true;
else
If the user clicks "No", set chkBox.IsChecked=false;

I think there is no way to stop checkbox default behaviors. So you can create a custom control with a image and a textbolck inside a stack panel. You should use pair of images for "Image" Control Source one for unchecked and another for checked.
//At start,the checkbox is unchecked
<StackPanel x:Name="panelCheckBox" Tap="panelCheckBox_Tap_1" Orientation="Horizontal">
<Image Source="UncheckImageSourc" x:Name="ImgeCheckBox"/>
<TextBlock Text="CheckBox Content"/>
</StackPanel>
In Code Behind
bool IsChecked=false;
private void panelCheckBox_Tap_1(object sender, System.Windows.Input.GestureEventArgs e)
{
//If user click "Yes,I want to do it",then checkmark is visible and now it is checked
if(!IsChecked)
{
IsChecked =true;
ImgeCheckBox.Source = "CheckImageSource";
}
else
{
IsChecked =false;
ImgeCheckBox.Source = "UncheckImageSourc";
}
}

Related

[WPF]How to close popup

I'd like to close a popup automatically with controling StaysOpen value which is popup property. I've been opening it whenever text is entered or left mouse button is clicked.
StaysOpen is set to false.
<Grid>
<TextBox x:Name="textBox" PreviewMouseLeftButtonUp="textBox_PreviewMouseLeftButtonUp"/>
<Popup IsOpen="{Binding IsOpen, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" OpacityMask="Transparent" StaysOpen="{Binding StaysOpen, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
AllowsTransparency="True" PlacementTarget="{Binding ElementName=textBox}">
<Border CornerRadius="5" Background="#FF303030" Width="{Binding ActualWidth, ElementName=textBox}">
...
</Border>
</Popup>
</Grid>
private void textBox_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
if ((sender as TextBox).Text.Length > 0)
{
IsOpen = !IsOpen;
}
}
When text is entered in Textbox with Popup's IsOpen is true, can be closed automatically popup when clicked out side of the control. But, in a state of textBox_PreviewMouseLeftButtonUp function call with same situations, wouldn't be closed it automatically.(also IsOpen is true)
If i change to e.handel = true in textBox_PreviewMouseLeftButtonUp, then can be closed automatically, through clicking the outside of it. But it have serious problem on that, can not choose any of controls in the popup. so can not use this way.
How can I safely close the popup automatically by clicking out side of control?
You can use the TextBox's LostKeyboardFocus event, which fires when the TextBox is no longer the destination for keyboard input (i.e. when the user clicks or tabs away from the control).
private void textBox_LostKeyboardFocus(object sender, KeyboardFocusChangedEventArgs e)
{
IsOpen = false;
}
Also, for opening the popup, I might recommend using GotKeyboardFocus. PreviewMouseLeftButtonUp will only work if the user sets focus by left-clicking, but the user could also use tab, etc.
Not perfect, but I solved it.
I added MouseLeftButtonUpEvent instead of PreviewMouseLeftButtonUp.
textBox.AddHandler(MouseLeftButtonUpEvent,
new RoutedEventHandler(textBox_MouseLeftButtonUp),
true);
When external control is clicked, Pop up is closed automatically, and when TextBox is clicked, Pop up is opened.
However, If Pop up is displayed, When TextBox is clicked, Pop up isn't hidden.
Anyway, I think this is enough.

Issue with Visibility setting of a control inside a group box WPF

I have my groupbox defined inside a window as follows
<ScrollViewer>
<Grid Name="gridMain">
<GroupBox x:Name="grp" Header="Group" Margin="0,71,0,0">
<Grid Margin="0,69,0,0" x:Name="gridmain">
<CheckBox x:Name="ChkShow" Content="Hide Controls" IsChecked="True" Checked="ChkShow_Checked" Unchecked="ChkShow_Unchecked" Margin="27,52,76,38"></CheckBox>
<Label x:Name="lblUsername" Content="Username" Margin="21,10,107,68" Visibility="Hidden"></Label>
</Grid>
</GroupBox>
</Grid>
</ScrollViewer>
This is my code to show/hide the control
private void ChkShow_Unchecked(object sender, RoutedEventArgs e)
{
lblUsername.Visibility = Visibility.Hidden;
}
private void ChkShow_Unchecked(object sender, RoutedEventArgs e)
{
lblUsername.Visibility = Visibility.Visible;
}
But I am unable to find the control it is getting as null so how can I over come this issue
It's all about order.
The CheckBox is created first. The event handlers are attached and the value is set to True. The event handler fires and tries to call the not-yet-created Label. Hence the Label is having the value null.
If you move the label to above the CheckBox it does work. It will also work if you would attach the event handlers later on, for example in the OnLoad method.
I faced a same issue.
Actually checkbox event fire before label control initialize.
So you need to check first control is initialized first, means control not equal to null.
Or you can directly set visibility using binding(need bool to visibility converter) or you can set visibility using data trigger.
<Label x:Name="lblUsername" Content="Username" Margin="21,10,107,68" Visibility="{Binding path=IsChecked, ElementName=ChkShow, Converter={StaticResource converter}}"></Label>
Here is link for bool to visible converter http://wpftutorial.net/ValueConverters.html

How to determine which child element of a ListView Item was clicked?

I'm developing a windows phone 8.1 app in XAML and C#. I have a ListView getting its Items from a bound list and displaying them through a DataTemplate. Now, in this DataTemplate there are multiple child elements, and when the user taps on an item in the list, I want to be able to determine what child element he actually touched. Depending on that, the app should either expand a view with more details inside the Item, or navigate to another page.
The ItemClick event handler of the ListView is ListView_ItemClick(object sender, ItemClickEventArgs e), and I thought e.OriginalSource would maybe give me the answer, but this just gave me the clicked ListItem.
I have yet to try if encapsulating the children with buttons and intercepting their click events would work, but I'm happy to try any alternative there might be for this.
I just found the solution myself. I set the ListView to SelectionMode="None" and IsItemClickEnabled="False", and then I added Tapped handlers for the individual child elements. Works just as I wanted.
I've got a TextBlock and an Image in one ListViewItem and have just used the Image_PointerPressed event. Doing that also fires the ItemClick event for the ListView so I disable it first, do the stuff I want, then re-enable the ItemClick event so that still fires when the TextBlock is pressed.
Code behind:
private async void imgDone_PointerPressed(object sender, PointerRoutedEventArgs e)
{
// disable click event so it won't fire as well
lvwCouncils.IsItemClickEnabled = false;
// do stuff
MessageDialog m = new MessageDialog("User Details");
await m.ShowAsync();
// Re-enable the click event
lvwCouncils.IsItemClickEnabled = true;
}
Xaml:
<ListView x:Name="lvwCouncils" ItemClick="lvwCouncils_ItemClicked" IsItemClickEnabled="true" >
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock
Grid.Column="1"
Text="{Binding council_name}"
FontSize="24"
Margin="10,10,30,10"
/>
<Border Height="20" Width="20" Margin="10,10,0,10" >
<Image x:Name="imgDone"
Source="Assets/user_earth.png" Stretch="UniformToFill" PointerPressed="imgDone_PointerPressed"/>
</Border>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Use the SelectionChanged event.
Cast the sender object to ListView type and then retrieve the item from the SelectedItem property.
Similar question here but for a different control :
Get the index of the selected item in longlistselector

Why button changes color when I click or hover on it? Xaml windows 8

I have created a button using XAML and have defined some simple properties for it.
<Button Name="btnNext" Grid.Row="1" Content="PARA" Width="200" Grid.Column="1" Background="#FF2D2D2D" HorizontalAlignment="Right" FontSize="40" Height="380" BorderThickness="0" />
It happens that when I click on the button or put the mouse over, it changes color.
I have tried to escape this behaviour in the btnNext_Click method but it does not affect anything.
private void btnNext_Click(object sender, RoutedEventArgs e)
{
Button button = sender as Button;
if (button != null)
{
button.Background = new SolidColorBrush(hexToColorConvertor("#FF2D2D2D"));
START_POINT += (uint)NUMBER_OF_BUTTONS1;
ReadFile(START_POINT);
}
}
Does anyone have any idea how to resolve this?
In XAML, button have default style for different states like Normal, MouseOver, Pressed etc..
Whenever button moves from one state to another, it changes its look using default style obviously. You can find more information related to default style here
Now, If you want to override this default behavior, you can do it easily with Expression-blend. More of this can be found here and here
Hope this information will help you.. :)

WP8 - Show MessageBox before leaving Pivotitem

I load some quiz questions in one of my PivotItems.
My problem is when the user is in this PivotItem and if swipe to go to another PivotItem I want to get pop-up MessagePrompt before leaving this PivotItem to another, asking if the user really want to finish the quiz. I tried LostFocus event and Unloaded event but nothnig happens.
How can i manage this?
P.S. I know that the Quiz should be in another page, but I want to achieve this with pivotItems.
Subscribe to pivots selectionChanged event
Pivot_SelectionChanged Event
{
if(Pivot.selectedindex==1|| 3|| 4)
{
Messagebox();
}
}
Assuming 2 is your pivot items index.
now if the user chooses "yes" then assign pivots selectedindex to 2
You can subscribe to the SelectionChanged event whenever a PivotItem is changed. Check the link for some examples from MSDN.
http://msdn.microsoft.com/en-us/library/windowsphone/develop/microsoft.phone.controls.pivot.selectionchanged(v=vs.105).aspx
I haven't tried this out yet, but I believe the PivotItem will still change even when the pop-up occurs. So once you get the pop-up and you give the user a choice to stay on the current Pivot or go to the next, you might have to change the PivotItem programatically back to the quiz Pivot.
A slightly messy way would be to preserve the currently selected Pivot Index state, and subscribe to the DragStartedGestureEventArgs using the windows phone controls toolkit.
<controls:Pivot x:Name="pivotControl" Title="MY APPLICATION">
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragStarted="SelectedPivotChanging"></toolkit:GestureListener>
</toolkit:GestureService.GestureListener>
<controls:PivotItem Header="item1">
<Grid />
</controls:PivotItem>
<controls:PivotItem Header="item2">
<Grid/>
</controls:PivotItem>
</controls:Pivot>
private void SelectedPivotChanging(object sender, DragStartedGestureEventArgs e)
{
if (pivotControl.SelectedIndex == 0)
{
if (MessageBox.Show("Are you sure you wish to navigate away?", "Un-Answered questions", MessageBoxButton.OKCancel)
== MessageBoxResult.Cancel)
{
//pivotControl.SelectedIndex = previousIndex;
}
}
}

Categories

Resources