I have a few contorls and I set the tabindex for the control that I want to stop. I use the emulator to test it. After typing the enter button on the key pad, the cursor stay on the textbox. Would someone show me the link or code to make it work? Thanks in advance.
The following is my code for the controls:
<TextBox x:Name="txtUser" Grid.Row="1" Grid.Column="2" IsTabStop="True" TabIndex="1" Style="{StaticResource txtStyle_24}" FontSize="32" />
<TextBlock x:Name="Password" Text="Password :" Grid.Row="2" Grid.Column="1" Style="{StaticResource LabelStyle_24}" HorizontalAlignment="Left" VerticalAlignment="Center" FontSize="32" Foreground="{StaticResource PhoneAccentBrush}" />
<PasswordBox x:Name="psd" PasswordChar="*" Grid.Row="2" Grid.Column="2" IsTabStop="True"
TabIndex="2" Style="{StaticResource PasswordBoxStyle_24}" FontSize="32"/>
TabIndex doesn't make sense in Windows Phone
If you want to move focus to next TextBox, subscribe to KeyUp event and check e.Key == Keys.Enter. Than move focus with textBox.Focus()
I saw behavior for this but can't find a link now
Related
I have problems with the SIP (keyboard). It hides the currently focussed textbox.
I have a form with some numbers of TextBoxes and I change focus by tapping ↲ on the SIP.
But then the keyboard hides the textbox...
all my textboxes are in StackPanel and around by
Is this a known problem? Is there a solution?
<ScrollViewer x:Name="Scroller" Grid.Row="1">
<StackPanel Orientation="Vertical">
<TextBlock Text="Name"/>
<TextBox x:Name="txtName" />
<TextBlock Text="Email"/>
<TextBox x:Name="txtEmail"/>
<TextBlock Text="Phone"/>
<TextBox x:Name="txtPhone" />
<TextBlock Text="Adress"/>
<TextBox x:Name="txtAddress" />
</StackPanel>
</ScrollViewer>
keep your code inside the <ListBox>. It will not hide then.
I've just started using the Expensify Windows Phone Test Framework and it seems to fit my requirements for automated testing of Windows Phone 7.1 quite well. I can get it to trigger a normal button on the screen but cannot get it to trigger either of my ApplicationBar buttons.
The XAML for this test page is ...
<phone:PhoneApplicationPage x:Class="SampleApp1.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
xmlns:AppBarUtils="clr-namespace:AppBarUtils;assembly=AppBarUtils"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait"
Orientation="Portrait"
mc:Ignorable="d"
d:DesignWidth="480"
d:DesignHeight="768"
shell:SystemTray.IsVisible="True"
DataContext="{Binding Main, Source={StaticResource Locator}}">
<!--LayoutRoot contains the root grid where all other page content is placed-->
<Grid x:Name="LayoutRoot"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel"
Grid.Row="0"
Margin="24,24,0,12">
<TextBlock x:Name="ApplicationTitle"
Text="{Binding ApplicationTitle}"
Style="{StaticResource PhoneTextNormalStyle}" />
<TextBlock x:Name="PageTitle"
Text="{Binding PageName}"
Margin="-3,-8,0,0"
Style="{StaticResource PhoneTextTitle2Style}" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentGrid"
Grid.Row="1">
<StackPanel Margin="24,20,0,123" Orientation="Vertical">
<TextBlock Text="{Binding Welcome, Mode=OneWay}"
Style="{StaticResource PhoneTextNormalStyle}"
HorizontalAlignment="Center" VerticalAlignment="Center"
Margin="6,0,19,0" TextWrapping="Wrap" Width="431" />
<TextBlock Text="Enter first number"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,20,0,0" TextWrapping="Wrap" />
<TextBox TextChanged="OnTextBoxTextChanged"
Text="{Binding EnteredAmount1, Mode=TwoWay, UpdateSourceTrigger=Explicit}"
x:Name="txtValue1"
HorizontalAlignment="Left" Height="72" VerticalAlignment="Top" Width="456"
TextWrapping="Wrap" InputScope="Number"/>
<TextBlock Text="Enter second number"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,0,0,0" TextWrapping="Wrap" />
<TextBox TextChanged="OnTextBoxTextChanged"
Text="{Binding EnteredAmount2, Mode=TwoWay, UpdateSourceTrigger=Explicit}"
x:Name="txtValue2"
HorizontalAlignment="Left" Height="72" VerticalAlignment="Top" Width="456"
TextWrapping="Wrap" InputScope="Number"/>
<TextBlock Text="Result"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="6,20,0,0" TextWrapping="Wrap"/>
<TextBlock Text="{Binding Total, Mode=OneWay}"
HorizontalAlignment="Left" VerticalAlignment="Top"
Margin="15,0,0,0" TextWrapping="Wrap"
Width="422" Height="45"/>
<Button x:Name="btnAdd" Command="{Binding AddCommand}" Content="Add" Margin="240,0,0,0" />
</StackPanel>
</Grid>
</Grid>
<phone:PhoneApplicationPage.ApplicationBar>
<shell:ApplicationBar IsVisible="True" IsMenuEnabled="False">
<shell:ApplicationBarIconButton x:Name="AddAppBarBtn" IconUri="/Images/ApplicationBar.Check.png" Text="add"></shell:ApplicationBarIconButton>
<shell:ApplicationBarIconButton x:Name="SubtractAppBarBtn" IconUri="/Images/ApplicationBar.Cancel.png" Text="subtract"></shell:ApplicationBarIconButton>
</shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>
<i:Interaction.Behaviors>
<AppBarUtils:AppBarItemCommand Id="add" Command="{Binding AddCommand}"/>
<AppBarUtils:AppBarItemCommand Id="subtract" Command="{Binding SubtractCommand}"/>
</i:Interaction.Behaviors>
<i:Interaction.Triggers>
<AppBarUtils:AppBarItemTrigger Type="Button" Id="add" Text="add" />
<AppBarUtils:AppBarItemTrigger Type="Button" Id="subtract" Text="subtract" />
</i:Interaction.Triggers>
</phone:PhoneApplicationPage>
The SpecFlow features are defined as follows ...
Scenario: AppBar Add Two Numbers
Given my app is uninstalled
And my app is installed
And my app is running within 20 seconds
Then I enter "34" into the control "txtValue1"
Then I enter "23" into the control "txtValue2"
Then I press the control "AddAppBarBtn"
Scenario: Button Add Two Numbers
Given my app is uninstalled
And my app is installed
And my app is running within 20 seconds
Then I enter "34" into the control "txtValue1"
Then I enter "23" into the control "txtValue2"
Then I press the control "btnAdd"
The ButtonAddTwoNumbers scenario fully works. The AppBarAddTwoNumbers fills in the text box values but refuses to press the button, The error I get is "Failed to set focus to control 'AddAppBarBtn'".
Any help on this would be appreciated.
I think you are working one level too high. Personally I wouldn't normally test the UI itself as in the long term it just leads to brittle tests that constantly need changing. Instead I would normally come down to the ViewModels.
So given that your txtValue1 is bound to EnteredAmount1, txtValue2 is EnteredAmount2 and AddAppBarBtn is AddCommand, you can test your business logic as
Scenario: AppBar Add Two Numbers
Given I enter 34 into Amount1
And I enter 23 into Amount2
When I add them #Calls AddCommand
Then Total should be 57
This means that you can redesign your UI very easily, so say for example if we wanted to use sliders instead of textboxes, there would be NO changes to the above logic tests.
In addition you can still test your UI features as seperate features
Scenario: Check startup
Given my app is uninstalled
When my app is installed
Then my app should be running within 20 seconds
And if you really want you can still check your bindings too
Scenario: Check bindings
Given I enter 34 into Amount1
Then control txtValue1 should be 34
In this way you'll break your tests into smaller chunks of the application and give yourself more targetted failures, which is really useful when tracking down any problems.
I Have a little problem with a ListBox and its elements. As you can see in my code, the stackpanel for both textblocks is set to 250. This is set like this because otherwise the text expands in 1 line and you cannot see the button. As obvious the problem is that setting this parameter as static, if the resolution or the orientation changes wont fit the screen completely. I would like to know if there is a way to set this width dynamically.
<ListBox x:Name="attractionsListbox" Margin="0,0,-12,0" ItemsSource="{Binding Attractions}" Loaded="attractionsListbox_Loaded">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Tag="{Binding Name}" Tap="AttractionListBoxItem_Tap">
<Image Height="140" Width="140" Margin="0,5,0,0" Source="{Binding Thumbnail}" MaxWidth="140" MaxHeight="140" Stretch="Fill" />
<StackPanel Width="250">
<TextBlock x:Name="AttractionName" Text="{Binding Name}" TextWrapping="Wrap" Style="{StaticResource PhoneTextSmallStyle}" FontSize="20" Foreground="Black" FontWeight="Bold" />
<TextBlock Text="{Binding ShortDescription}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSmallStyle }" Foreground="Black" />
</StackPanel>
<Button Width="80" Height="80" Padding="10,3,10,5" BorderBrush="Black" Click="Add_Todo_Click" Tag="{Binding Name}">
<Button.Background>
<ImageBrush ImageSource="/SundsvallWP7;component/Images/appbar.add.rest.png"/>
</Button.Background>
</Button>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
(In android there is weights, where you can assign the weight of each control, don't know if this exists in Windows Phone).
Thank you very much.
A DockPanel may work better for your scenario than a StackPanel. Put the button on the right and the image on the left, then your middle StackPanel content will flow to fill.
http://www.windowsphonegeek.com/articles/Using-DockPanel-in-WP7.
Alternatively, there are only the two orientations and resolution shouldn't be changing. You could just bind the Width to the Orientation with a value converter.
I'm displaying a simple twitter feed in my app and I have implemented a refresh method in the context menu. Problem is that displaying the context menu performs poorly (it's not a matter of quantity of items, happens with just a few). It seems I need to tap/hold extra long and then the context menu appears - not with the smooth animation, but a bit with a jolt.
Ideally it would be nice to have it perform more like the people hub where there is instant feedback that you've tapped the item, and then the context menu appears in with the smooth animation.
Another part of this that baffles me is when the context menu does appear, the rest of the screen sort of "shrinks to the background" to draw attention to the selected item. It seems this would have something to do with the perf problem. Again, look to the people hub for ideal behavior on this matter.
Any tips on how to implement this better?
here's my xaml:
<!-- twitter feed-->
<controls:PivotItem Header="feed">
<ScrollViewer>
<StackPanel>
<ItemsControl ItemsSource="{Binding Tweets}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<Border Padding="12">
<toolkit:ContextMenuService.ContextMenu>
<toolkit:ContextMenu >
<toolkit:MenuItem Header="refresh" Command="{Binding Main.RefreshTweetsCommand, Source={StaticResource Locator}}" />
</toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding user.profile_image_url}" Margin="0,12,0,0" Height="80" Width="80" Stretch="UniformToFill" VerticalAlignment="Top"/>
<Border Padding="12,0,0,0">
<StackPanel>
<TextBlock Text="{Binding user.name}" Foreground="Blue" FontSize="30" />
<TextBlock Text="{Binding date_created}" FontSize="16"/>
<TextBlock Text="{Binding text}" FontSize="20" TextWrapping="Wrap" Width="320" />
</StackPanel>
</Border>
</StackPanel>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<TextBlock Text="more . . ." FontSize="32" Padding="20">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Tap">
<cmd:EventToCommand Command="{Binding MoreTweetsCommand, Mode=OneWay}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBlock>
</StackPanel>
</ScrollViewer>
</controls:PivotItem>
The "shrinks to the background" problem is done in the people hub too, it's just not as obvious. You can change this with the IsZoomEnabled property, see http://www.windowsphonegeek.com/articles/WP7-ContextMenu-in-depth--Part1-key-concepts-and-API.
I've noticed that the animation is quite jerky as well, in comparison to Microsoft's implementation.
I have an application where user is adviced to write numbers only in a textBox. However, on textBox GotFocus-attribute I end up with a regular keyboard. How can I change this to phone dialer input, or a number-only input?
<TextBox
Grid.ColumnSpan="2"
Grid.Row="3"
Grid.Column="0"
FontSize="80"
FontWeight="Bold"
Height="130"
HorizontalAlignment="Center"
Width="200"
Margin="0,0,0,0"
Name="userAnswer"
Text=""
TextAlignment="Center"
VerticalAlignment="Stretch"
GotFocus="userAnswer_GotFocus"
Background="White"
Foreground="Black"
/>
You need to use the InputScope attribute:
InputScope="TelephoneNumber"