We Keep Coding

WPF TextBox does not lose focus

I knwow there are many other who wrote about this but the suggested solutions don't solve my problem.
I've got a sort of gallery and I need that when the user edits the number specified in the TextBox automatically the image is updated.
Initially I tried with LostFocus event, but it doesn't always fire as explained here.
If I bind the property as suggested here, I have too many events if the number has more than one digit.
Then I tried to do this, but it doesn't work.
This is how my TextBox is defined:
<TextBox Margin="2" Text="{Binding NImageShown}" FontSize="18"
LostFocus="ImageIndex_OnLostFocus"
Name="ImageIndex" Height="40" Width="60"
VerticalAlignment="Center" VerticalContentAlignment="Center"
Focusable="True">
</TextBox>
I implemented the third solution by attaching the window to MouseDown event:
<Window x:Class="...."
.....
MouseDown="Window_MouseDown"....>
private void Window_MouseDown(object sender, MouseButtonEventArgs e)
{
if (ImageIndex.IsFocused)
Keyboard.ClearFocus();
}
With this solution I sawy that ImageIndex.IsFocused remains true even after Keyboard.ClearFocus(): this is the reason why I think that solution does not fix my problem.
Any help is really appreciate!
EDIT
Changes based on the suggestions:
<Grid Grid.Row="2" Grid.Column="2" Name="GridTextbox">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
.....
<StackPanel Grid.Column="2" Orientation="Horizontal"
HorizontalAlignment="Right">
<TextBox Margin="2" Text="{Binding NImageShown}" FontSize="18" LostFocus="ImageIndex_OnLostFocus"
Name="ImageIndex" Height="40" Width="60" VerticalAlignment="Center" VerticalContentAlignment="Center" Focusable="True"></TextBox>
<Label Style="{DynamicResource LabelStyle}" VerticalAlignment="Center"
Content="{Binding NTotalImages}" FontSize="18" Padding="5,0,5,0" Margin="5,5,5,5" />
</StackPanel>
</Grid>
private void Window_MouseDown(object sender, MouseButtonEventArgs e)
{
if (ImageIndex.IsFocused)
{
GridTextbox.Focus();
Keyboard.ClearFocus();
}
}
Even with these changes, LostFocus doesn't fire.
SOLUTION
Change the xaml as suggested in this way and keep the code behind as written before:
<TextBox Margin="2" Text="{Binding NImageShown}" FontSize="18"
LostKeyboardFocus="ImageIndex_OnLostFocus"
KeyDown="ImageIndex_OnLostFocus"
Name="ImageIndex" Height="40" Width="60"
VerticalAlignment="Center" VerticalContentAlignment="Center"
Focusable="True">
</TextBox>

C# UWP ToggleSwitch in ListView

Suppose you have the ListView below :
<ListView x:Name="ListViewActiveAssets" Margin="10,10,10,10" CanReorderItems="True" AllowDrop="True" CanDragItems="True" SelectionMode="Extended" DragItemsStarting="ListViewActiveAssets_DragItemsStarting" DragItemsCompleted="ListViewActiveAssets_DragItemsCompleted">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:Asset">
<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="36" />
<ColumnDefinition Width="36" />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition Width="108" />
</Grid.ColumnDefinitions>
<TextBlock Text="" FontFamily="Segoe MDL2 Assets" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="{x:Bind AssetType}" FontFamily="Segoe MDL2 Assets" Grid.Column="1" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="{x:Bind Name}" Grid.Column="2" FontSize="18" VerticalAlignment="Center" Padding="0,0,5,0"/>
<TextBlock Text="{x:Bind StartDate}" Grid.Column="3" FontSize="16" VerticalAlignment="Center" Padding="0,0,5,0"/>
<TextBlock Text="{x:Bind EndDate}" Grid.Column="4" FontSize="16" VerticalAlignment="Center" Padding="0,0,5,0"/>
<ToggleSwitch Grid.Column="8" x:Name="ToggleSwitchEnable" IsOn="{x:Bind IsEnabledSwitch}" OnContent="On" OffContent="Off" Padding="5,0" Toggled="ToggleSwitchEnable_Toggled"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
This ListBox can be reordered and this work fine. I simply would like to know why the Toggled event is fired when I reorder an item in ListView ?
Indeed, my Toggled event contains code that refresh the ListView, so when I'am dragging item, the ListView refreshes and the drag&drop fail.
If someone have a suggestion... Thanks in advance!

Try adding a local bool in your class and set it to false in your constructor:
private bool toggling;
public myPage()
{
toggling = false;
}
Then, in your OnToggled method, start by setting toggling to true and then set it back to false at the end of the method.
void ToggleSwitchEnable_Toggled(object sender, EventArgs e)
{
toggling = true;
// Your code
toggling = false;
}
You can then set your refresh method to only execute when toggling is false:
void refresh()
{
if(toggling)
return;
//Your code
}
This will cause the refresh command to be skipped whenever you toggle the switch

Adding content to PivotItem dynamically

I have a page with a Pivot. It´s based on the Visual Studio Template.
<!--Pivot Control-->
<phone:Pivot SelectionChanged="evt_pivot_SelectionChanged">
<phone:Pivot.Title>
<StackPanel HorizontalAlignment="Center">
<!-- <TextBlock Text="MyApp" /> -->
<Image Stretch="None" HorizontalAlignment="Left" Margin="0" MinWidth="50" MaxHeight="50" Source="/mAppData/logo.png"/>
</StackPanel>
</phone:Pivot.Title>
<!--Pivot item one-->
<phone:PivotItem Header="Favoriten">
<!--Double line list with text wrapping-->
<phone:LongListSelector Margin="13,0,0,0" ItemsSource="{Binding Items}">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,0,0,25">
<Grid VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="100" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Grid.ColumnSpan="2" Text="FELIX ClubRestaurant (Berlin)" TextWrapping="NoWrap" Style="{StaticResource PhoneTextLargeStyle}" VerticalAlignment="Top" Margin="0,0,0,22" />
<Image Grid.Column="0" Width="110" Height="20" Source="/mAppData/stars-3.png" HorizontalAlignment="Left" VerticalAlignment="Bottom" Margin="0"/>
<TextBlock Grid.Column="1" Text="10 min." TextWrapping="NoWrap" Margin="0" Style="{StaticResource PhoneTextSubtleStyle}" HorizontalAlignment="Right" VerticalAlignment="Bottom"/>
</Grid>
<Grid VerticalAlignment="Top" Margin="0,10,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Width="100" Height="100" Source="http://img.myserver.net/news-teaser//p189j19861b36c5d1pp012i21grgd.gif"/>
<Image Grid.Column="1" Width="100" Height="100" Source="http://img.myserver.net/news-teaser//p187qrndfcj0la0f12clfkv10ec7.gif"/>
<Image Grid.Column="2" Width="100" Height="100" Source="http://img.myserver.net/news-teaser/005e5d03f058fa8f7bd95f6410dfc6d6.gif"/>
<Image Grid.Column="3" Width="100" Height="100" Source="http://img.myserver.net/news-teaser/3c05cbf76fba7ada5182b4426e55d96b.gif"/>
</Grid>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</phone:PivotItem>
<!--Pivot item two-->
<phone:PivotItem Header="Empfohlen">
</phone:PivotItem>
</phone:Pivot>
I added in CodeBehind the handling for the event SelectionChanged. That works fine. So I can capture by code, when user comes to the second PivotItem.
private async void evt_pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
int mPivotIndex = Convert.ToInt16(((Pivot)sender).SelectedIndex.ToString());
if (mPivotIndex == 1)
{
// HERE I WANT TO INSERT THE SOLUTION
}
}
Now comes my problem: When user navigates to seconds item, I want to:
request some data from an WebService (this in not the problem)
transform the data (this is not the problem) and
populate the data in a LongListSelector (THIS IS MY PROBLEM PART 1)
In case that an error occures, I want not to display the LongListSelector but a TextBox showing a message (THIS IS MY PROBLEM PART 2)
How can I get my 2 problems get working?

You will need to bind the text/content of your controls in the itemtemplate to the data collection fieldname
Text="{Binding Fieldname}"
http://msdn.microsoft.com/en-us/library/windowsphone/develop/jj207023(v=vs.105).aspx
In your error handling, set the visibility of the Longlistselector to Collapsed. Then you can show another control which displays the textbox
<StackPanel>
<LongListSelector x:Name=”MyListSelector”>
..stuff
</LongListSelector>
<TextBlock x:Name=”MyError” Visibility=”Collapsed”> </TextBlock>
</StackPanel>
Catch (Exception Ex)
{
MyListSelector.Visibility = Visibility.Collapsed
MyError.Visibility = Visibility.Visible
MyError.Text = Ex.Message;
}

you can hide the Longlist selector and add the Textbox with the Error message directly from the code behind. see the code below.
try
{
//make the service call and do your stuff
}
catch(exception ex)
{
MyListSelector.Visibility = Visibility.Collapsed;
var errorTextBox = new TextBox();
errorTextBox.Text = "some Error has occured";
//add all the properties you want to add for textbox such as color,height,fontsiz ect..
//Name your pivotitem control, say pivotitem1
pivotitem1.Content = errorTextBox;
}
hope this helps.
Note: uncompiled code. pardon compilation errors

ManipulationCompleted event is not firing on Button

In my Windows Phone 8.1 Universal Application, I have a ListView with a button in the ItemTemplate, and I need to see when that button's ManipulationStarted and ManipulationCompleted events are fired. Currently ManipulationStarted works fine, but ManipulationCompleted does not. Could someone help explain why?
SnapsPage.xaml
<Grid Grid.Row="0" Background="#88686868">
<Grid.RowDefinitions>
<RowDefinition Height="130" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Vertical" Margin="20,0,0,0">
<TextBlock Text="{Binding Path=Manager.Account.Username, FallbackValue='loading...'}" Margin="0,12,0,0" Style="{ThemeResource HeaderTextBlockStyle}"/>
<TextBlock x:Uid="Snaps" Text="SNAPS" Style="{ThemeResource TitleTextBlockStyle}" Typography.Capitals="SmallCaps"/>
</StackPanel>
<ScrollViewer x:Name="ScrollViewer" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled"
Padding="0,0,0,20" Grid.Row="1" HorizontalContentAlignment="Stretch">
<ListView HorizontalContentAlignment="Stretch"
ItemsSource="{Binding Path=Manager.Account.Snaps}">
<ListView.ItemTemplate>
<DataTemplate>
<Button x:Name="ButtonSnap" Style="{StaticResource BasicEmptyButtonStyle}"
ManipulationStarting="ButtonSnap_OnManipulationStarting"
ManipulationCompleted="ButtonSnap_OnManipulationCompleted"
ManipulationMode="All"
Command="{Binding ElementName=ItemsControl, Path=DataContext.TryDownloadMediaCommand}"
CommandParameter="{Binding}">
<!-- Content Here -->
</Button>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel HorizontalAlignment="Stretch"></VirtualizingStackPanel>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
</ListView>
</ScrollViewer>
</Grid>
<Grid Grid.Row="0" x:Name="MediaGrid" Background="#FF000000" IsHitTestVisible="False">
<Image x:Name="MediaImage" IsHitTestVisible="False"/>
<Grid Width="45" Height="45" Background="#99000000"
VerticalAlignment="Top" HorizontalAlignment="Right" Margin="25">
<TextBlock Text="10" VerticalAlignment="Center" HorizontalAlignment="Center" FontFamily="Segoe WP Semibold" FontSize="24" />
</Grid>
</Grid>
SnapsPage.cs
private void ButtonSnap_OnManipulationStarting(object sender, ManipulationStartingRoutedEventArgs e)
{
Debug.WriteLine("ButtonSnap_OnManipulationStarting");
var button = sender as Button;
if (button == null) return;
var snap = button.DataContext as Snap;
if (snap == null) return;
_relevantSnap = snap;
_isFingerDown = true;
_scrollYIndex = ScrollViewer.VerticalOffset;
_holdingTimer.Start();
}
private void ButtonSnap_OnManipulationCompleted(object sender, ManipulationCompletedRoutedEventArgs e)
{
Debug.WriteLine("ButtonSnap_OnManipulationCompleted");
_isFingerDown = false;
if (_isMediaOpen)
DisposeMediaTidily();
}

Note: I tested with Windows Phone 8.1 XAML App (not Silverlight)
The Button has a ManipulationMode of System which, according to the docs, means that you should not get manipulation events.
An element must have a ManipulationMode value other than None or System to be a manipulation event source

Accessing mediaelement in listbox wp7

I have a MediaElement inside ListBox.How I can get access to "audiop_Copy" by buttons "play/pause"?
<local:TypeTemplateSelector.WithAudio>
<DataTemplate>
<Grid Margin="0,5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="1">
<TextBlock ... />
<StackPanel Height="50" Orientation="Horizontal" Margin="5,0,4,0" MinHeight="50">
</TextBlock>
<Button Click="PlayMedia" Content="Play" />
<Button Click="PauseMedia" Content="Pause" />
</StackPanel>
<MediaElement Name="audiop_Copy" Source="{Binding audioUri}" Stretch="None" HorizontalAlignment="Left" AutoPlay="False"/>
</StackPanel>
</Grid>
</DataTemplate>
</local:TypeTemplateSelector.WithAudio>

2 ways to do it from the spot (possibly there are more). You will need a pointer to your Button that was clicked anyway:
[difficult, inflexible, fragile] In button Click event handler use VisualTreeHelper class to navigate Visual Tree and find the element. Use sender as starting point
[better solution] use Tag property and binding.
<Button Click="PauseMedia" Content="Pause" Tag={Binding ElementName=audiop_Copy} />
And in handler something like that:
private void PauseMedia(object sender, RoutedEventArgs e)
{
var me = ((FrameworkElement) sender).Tag as MediaElement;
}