RelayCommand and popup in Windows Phone - windows-phone-8

I'm currently writing app for Windows Phone 8.0 and I have a problem with RelayCommand from MVVM Toolkit light and popup.
I have a LongListSelector on the popup:
<Popup x:Name="popUp" Grid.Row="0" Grid.RowSpan="3" Opened="PopupOpened">
<Grid>
<ScrollViewer Grid.Row="2" Margin="10">
<phone:LongListSelector ItemsSource="{Binding ItemsSelections}"
ItemTemplate="{StaticResource DetailsItemTemplate}" />
</ScrollViewer>
</Grid>
</Popup>
And item's template:
<DataTemplate x:Key="DetailsItemTemplate">
<Button VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" Margin="5,5,5,5"
Command="{Binding ElementName=LayoutRoot,Path=DataContext.ItemExecutionCommand}"
CommandParameter="{Binding Type}">
</Button>
</DataTemplate>
When I open popup for the first time, everything works fine, CanExecute returns false, buttons are disabled and the disable style is applied (foreground is gray). But, when I close popup and open again, buttons are disabled, but have normal style (foreground is white). Executing RaiseCanExecuteChanged method after every popup opening does not help.
Anyone has this problem?

Related

Windows phone ScrollViewer doesn't work when projection is applied

I discovered this issue in real complex project, but it's reproducible with simple test project. So I have the test UWP page
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid
VerticalAlignment="Top"
HorizontalAlignment="Left"
Height="100">
<Grid.Projection>
<PlaneProjection GlobalOffsetY="100"/>
</Grid.Projection>
<ScrollViewer
VerticalScrollMode="Enabled"
VerticalScrollBarVisibility="Visible">
<StackPanel>
<Button Content="1"/>
<Button Content="2"/>
<Button Content="3"/>
<Button Content="4"/>
<Button Content="5"/>
<Button Content="6"/>
<Button Content="7"/>
</StackPanel>
</ScrollViewer>
</Grid>
</Grid>
it works as expected in PC version, but scroller doesn't work in mobile (windows phone) version. the same story with Windows Phone 8.1
If to comment projection on parent grid - everything is ok.
Any ideas of fix or at least workaround for that issue?
it works as expected in PC version, but scroller doesn't work in mobile (windows phone) version.
By design,if a global transform of scrollviewer(Projection Transform here) can't be represented as a Matrix Transform, the underlying layer that handles touch interaction can't be used.
So if you only need to apply GlobalOffsetY or GlobalOffsetX. I recommend you using TranslateTransform instead. It won't prevent ScrollViewer from scrolling:
<Grid
VerticalAlignment="Top"
HorizontalAlignment="Left"
Height="500" Width="200">
<Grid.RenderTransform>
<TranslateTransform Y="100"/>
</Grid.RenderTransform>
<ScrollViewer
VerticalScrollMode="Enabled"
VerticalScrollBarVisibility="Visible">
<StackPanel>
<Button Content="1"/>
<Button Content="2"/>
<Button Content="3"/>
<Button Content="4"/>
<Button Content="5"/>
<Button Content="6"/>
<Button Content="7"/>
</StackPanel>
</ScrollViewer>
</Grid>

Windows Phone 8.1: How to change the background color and foreground color of ListPickerFlyout within a Button Flyout

I have a Windows Phone 8.1 Application.
I have a button with a ListPickerFlyout.
<Button x:Name="myButton"
Foreground="Red" Background="Green">
<Button.Flyout>
<ListPickerFlyout x:Name="myListPicker">
</ListPickerFlyout>
</Button.Flyout>
</Button>
I need to change the background and foreground color of the ListPickerFlyout.
I would be very glad if someone can help me.
Thanks in Advance.
To change the background I got the answer from this StackOverflow link
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.ThemeDictionaries>
<ResourceDictionary x:Key="Light">
<SolidColorBrush x:Key="FlyoutBackgroundThemeBrush" Color="Green" />
</ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>
</ResourceDictionary>
To change the Foreground:
The below example shows making the foreground as Red.
<ListPickerFlyout ItemsSource="{Binding Items}"
SelectedValue="{Binding SelectedItem, Mode=TwoWay}">
<ListPickerFlyout.ItemTemplate>
<DataTemplate>
<TextBlock Foreground="Red"
Text="{Binding name}" />
</DataTemplate>
</ListPickerFlyout.ItemTemplate>
</ListPickerFlyout>
If you want it to adapt to light and dark themes with White and Black Foregrounds, use a ThemeBrush like AppBarToggleButtonCheckedBorderThemeBrush.

Windows Phone 8.1 & MenuFlyout: How to disable zoom effect

I am trying to add context menu (through MenuFlyout) for button:
<StackPanel Orientation="Horizontal">
<Button Content="Item1" />
<Button Content="Item2" />
<Button Content="Item3" >
<Button.Flyout>
<MenuFlyout>
<MenuFlyoutItem Text="Item31" />
<MenuFlyoutItem Text="Item32" />
<MenuFlyoutItem Text="Item33" />
</MenuFlyout>
</Button.Flyout>
</Button>
</StackPanel>
But MenuFlyout zooms Button on which it opens. How to disable zoom effect?
You can't.
If you really need a simple overlay without animations, you need to create your own (an UserControl is an idea).

Multiple lists in windows phone

Can anyone suggest what is wrong with this xaml?
<phone:PivotItem Header="Test" x:Name="TestTab">
<Grid Margin="0,0,0,0">
<phone:LongListSelector x:Name="UserProducts" ItemsSource="{Binding Path=ProductList}">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<Grid x:Name="ProductDetailsGrid">
<Button x:Name="DisplayProductDetails" Content="{Binding Id}" Tap="DisplayProductDetailsButton_OnTap"/>
<phone:LongListSelector x:Name="ListSelector">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<TextBlock x:Name="TextBlock" Text="Hi"/>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</Grid>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</Grid>
</phone:PivotItem>
If I comment the inner LongList, it works fine and generate the buttons for each Item in ProductList. Does the inner list have to be bind as well? can I not bind it on run time?
IDEA:
What I want to achieve is following
when the user clicks on the particular button, I display the product details. so when user clicks on product a. I can at run time get details of product A and bind it to inner list.
what seems to happen is that LongListSelector is not direct child of the PivotItem, you don't need the Grid, remove it, that was causing the problem.

Change the detail page data on swipe in Windows Phone 8

Testing Windows Phone 8 Apps using MVVM framework.
ListPage.xaml:
<phone:PanoramaItem x:Name="mpnP" Width="475">
<Grid Style="{StaticResource GridPanoPage}" >
<ListBox x:Name="pkList" Style="{StaticResource ListBoxHeadlines}" >
<ListBox.ItemTemplate>
<DataTemplate >
<ListBoxItem Style="{StaticResource ListBoxItemHub}">
<StackPanel Orientation="Horizontal">
<Image x:Name="pkImage" Source="{Binding ImagePath}" />
<StackPanel>
<TextBlock x:Name="pkHead" Text="{Binding Head}"/>
</StackPanel>
</StackPanel>
</ListBoxItem>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</phone:PanoramaItem>
On List Box selection changed , navigate to detail page on the basis of ID-
if (!string.IsNullOrEmpty(Session.ID))
NavigationService.Navigate(new Uri("/Views/Detail.xaml", UriKind.Relative));
Now I want to navigate to next ID on Swipe screen. means -
if ID -- 3 is currently on screen and if user Swipe the screen then next ID detail will display on screen.
This process done till list box last id.
On the details page, can with the help of a FlipView navigate between several items. And every time the event SelectionChange occurs change the Id in ViewModel.
<toolkit:FlipView x:Name="FlipViewImages" ItemsSource="{Binding Images}" >
<toolkit:FlipView.ItemTemplate>
<DataTemplate>
<utils:ImageZoomControl Url="{Binding}"/>
</DataTemplate>
</toolkit:FlipView.ItemTemplate>
<toolkit:FlipView.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel Orientation="Horizontal"/>
</ItemsPanelTemplate>
</toolkit:FlipView.ItemsPanel>
</toolkit:FlipView>
The FlipView is not a native control, you have to import through the nuget Manager, Windows Phone ToolKit.
If your Item Source is a list of objects do not need to do anything else.