Windows Phone 8.1 & MenuFlyout: How to disable zoom effect - windows-phone-8.1

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).

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.

Hot to make content float over keyboard?

I have a page witch a fixed title followed by a content and a textbox that enables the user to post to my app. When the user press the textbox the keyboard shows up and all the control slide up making impossible for the user to scroll then back?
How can I make the controls float under the keyboard so the user can scroll it.
I have tried witch grids and scrollviewers without success :(
My layout:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto " />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Rectangle Width="Auto" Height="50" Fill="Red" />
<Grid Grid.Row="1">
<Rectangle Height="600" Fill="Green" VerticalAlignment="Top" />
</Grid>
<TextBox Grid.Row="1" Width="Auto" Background="Black" VerticalAlignment="Bottom" />
</Grid>
This is what is happening
This is what i expect to happen
The following article explains how to resolve the issue by manipulating the transformations done by the OS to the page.
http://klingdigital.net/2013/06/scrollviewer-and-multiline-textbox-windowsphone/

RelayCommand and popup in Windows Phone

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?

Best way to achieve underlined hyperlink on Windows Store apps?

From what I have read, there appears to be no functionality to achieve an underline for TextBlocks or HyperlinkButtons or the like in Windows RT, which appears ludicrous, but anyway, does anybody have an elegant approach to tackling this, specifically to create a link which runs a Click event or binding command?
As you can see out-of-the-box support doesn't appear to exist: http://social.msdn.microsoft.com/Forums/en-CA/winappswithcsharp/thread/cba0c363-60da-4e
This is how I've solved this problem before.
<HyperlinkButton x:Name="ExamplesLink" Click="ExamplesLink_Click"
Extensions:FrameworkElementExtensions.SystemCursor="Hand">
<TextBlock>
<Underline>
<Run Text="Examples"/>
</Underline>
</TextBlock>
</HyperlinkButton>
If you have the WinRT XAML toolkit you can set your cursor with the extension like above as well.
If you need (as in my case) to template the HyperlinkButton, keeping your bindings in your view, in you can do that in this way:
<Style TargetType="HyperlinkButton"
x:Key="StandardHyperlinkButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate>
<TextBlock Style="{StaticResource BaseEntityDetailTextStyle}">
<Underline>
<Run Text="{Binding Path=Content, Mode=OneWay, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
</Underline>
</TextBlock>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
...and then in your XAML view, for example:
<HyperlinkButton Style="{StaticResource StandardHyperlinkButton}"
Content="{Binding Path=myContent, Mode=OneWay}"
Command="{StaticResource myCommand}"
CommandParameter="{Binding Path=myContent, Mode=OneWay}" />
In this way you can also solve #sacha problem with bindings!
You can use a RichTextBlock with embedded HyperlinkButtons. If you look at RichTextBlockExtensions - you can use it to bind html text fragments (with anchor tags) to automatically populate a RichTextBlock with a linked text setup.
The problem with the above Hyperlinkbutton, AFAIK is that the Run Text is not bindable, so you end up having to repeat that TextBlock/Underline/Run pattern for every hyperlink button. Far better would be to make it a style.
For example if you try this, it will not work and an UnhandledException occurs
<HyperlinkButton Width="Auto" Height="Auto" Margin="2"
Content="{Binding DoctorName}"
Command="{Binding ElementName=scheduleView,
Path=DataContext.NavigateToAppointmentsDetailCommand}"
CommandParameter="{Binding DoctorName}">
<HyperlinkButton.Template>
<ControlTemplate>
<TextBlock>
<Underline>
<Run Text="{TemplateBinding Content}"/>
</Underline>
</TextBlock>
</ControlTemplate>
</HyperlinkButton.Template>
</HyperlinkButton>
The only way I found to fix this where the hyperlink text was also bindable was to use a fake underline rectangle and a regular button. I then show the underline (fake rectangle) based on whether the Pointer is over the button. Here is the relevant code:
Not the best solution but it is bindable for the content (link text), and its a generic solution.
<Button Width="Auto" Height="Auto" Margin="2"
Style="{StaticResource HyperLinkButtonStyle}"
Content="{Binding DoctorName}">
</Button>
<Storyboard>
<ObjectAnimationUsingKeyFrames
Storyboard.TargetProperty="(UIElement.Visibility)"
Storyboard.TargetName="rect">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="FocusStates"/>
</VisualStateManager.VisualStateGroups>
<StackPanel Orientation="Vertical">
<TextBlock x:Name="txt"
Text="{TemplateBinding Content}"
HorizontalAlignment="Center"
FontFamily="Segoe UI" FontSize="18" FontWeight="Thin"/>
<Rectangle x:Name="rect" Fill="White" Height="2" Visibility="Collapsed"
VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
</StackPanel>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>