using TabControl in windows phone - windows-phone-7

I read the article about using a TabControl on Windows Phone application. I can avoid it to fire when it is first load. However, the selectionChanged fired twice when user click the tab. Would someone can help me how to fix it. Thanks in advance.
There is my TabControl:
<cc:TabControl Grid.Row="1" SelectionChanged="tabList_SelectionChanged" x:Name="tabList">
<cc:TabItem Height="80" Header="Events" Foreground="Black"/>
<cc:TabItem Height="80" Header="Details" Foreground="Black"/>
<cc:TabItem Height="80" Header="Notes" Foreground="Black" />
</cc:TabControl>
There is cobe behind:
public partial class Tab : PhoneApplicationPage
{
private bool blnFristLoad=true;
public Tab()
{
InitializeComponent();
tabList.SelectionChanged += new SelectionChangedEventHandler(tabList_SelectionChanged);
}
private void tabList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (blnFristLoad == false)
{
TabItem t = (sender as TabControl).SelectedItem as TabItem;
t.Content = "202020";
}
else blnFristLoad = false;
}

It's very obvious in your code. You are adding SelectionChanged event handler twice. One from your XAML code and the other from the code behind. As you are using += symbol, the eventhandler is added as a seperate instance.
Remove one of those statements.

Please use the Pivot control instead of a TabControl for the WindowsPhone. the Pivot control follows the design guidelines for the phone and looks and feels much better.

Related

Complte event for Editor behaving like Unfocussed event

I am trying for saving some value in the editor after clicking on done on the keyboard for that I used the Completed event for the editor but this is calling while tapping on everywhere in the view like the Unfocused event. How to avoid that this?
<controls:CustomEditor Keyboard="Default"
ReturnKeyType="Next"
TextChanged="Comment_Changed"
Completed="OnDoneClicked"
VerticalOptions="StartAndExpand"
HorizontalOptions="FillAndExpand"
Text="{Binding QuestionComment}">
<controls:CustomEditor.FontSize>
<OnIdiom x:TypeArguments="x:Double">
<OnIdiom.Phone>
<OnPlatform x:TypeArguments="x:Double"
iOS="12"
Android="12"
WinPhone="30" />
</OnIdiom.Phone>
<OnIdiom.Tablet>
<OnPlatform x:TypeArguments="x:Double"
iOS="13"
Android="13"
WinPhone="40" />
</OnIdiom.Tablet>
</OnIdiom>
</controls:CustomEditor.FontSize>
</controls:CustomEditor>
CustomEditorClass is as following:
public const string ReturnKeyPropertyName = "ReturnKeyType";
public CustomEditor() { }
public static readonly BindableProperty ReturnKeyTypeProperty = BindableProperty.Create(
propertyName: ReturnKeyPropertyName,
returnType: typeof(ReturnKeyTypes),
declaringType: typeof(CustomEditor),
defaultValue: ReturnKeyTypes.Done );
public ReturnKeyTypes ReturnKeyType
{
get { return (ReturnKeyTypes)GetValue(ReturnKeyTypeProperty); }
set { SetValue(ReturnKeyTypeProperty, value); }
}
public enum ReturnKeyTypes : int
{
Default,
Go,
Google,
Join,
Next,
Route,
Search,
Send,
Yahoo,
Done,
EmergencyCall,
Continue
}
And the event is as following:
private async void OnDoneClicked(object sender, EventArgs e)
{
//some logic
}
Please see the documentation, this is the intended behavior
iOS (Unfocusing the editor or pressing "Done" triggers the event). Android / Windows Phone (Unfocusing the Editor triggers the event)
I've checked some messenger apps (iOS) and they don't have a done button on the keyboard at all, they provide a send button besides the entry control.
Depending on what you try to achieve, I'd ditch the done button on the keyboard altogether and rely on some sort of view on the UI, that is used for that purpose. This is platform dependent behavior anyway, Android does not support it at all, AFAIK. In order to get rid of the done button, you'll have to implement a custom renderer and set the InputAccessoryView of the native control to null (see here)
[assembly: ExportRenderer(typeof(CustomEditor), typeof(CustomEditorRenderer))]
namespace ProjectName.iOS
{
public class CustomEditorRenderer : EditorRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs e)
{
base.OnElementChanged(e);
this.Control.InputAccessoryView = null;
}
}
}
If you really want a button to send, you could create a derivative of Editor with a custom renderer, that creates a InputAccessoryView and raises an SendPressed event on your custom Editor when the InputAccessoryView is pressed. But remember, this is not possible for Android.

Windows phone app, how to use narrator read page title automatically?

I'm developing windows universal app(XAML,C#) on phone, and am enabling accessibility for Narrator. Does anybody know how to get narrator automatically to read page title when a page is opened?
I tried setting automationproperties.name in page but didn't work:
<Page
x:Class="xxxxxx"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
AutomationProperties.Name="Page title to be read"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
The features of the Narrator for UWP are applied when you select a control in a list, or editing a textbox. If you want to read content when the app is opened you should use the SpeechSynthesizer API, which is really easy to implement:
1.- In XAML add a Media Element
<MediaElement x:Name="MediaElement"/>
2.-Then in the code behind of the page:
public MainPage()
{
this.InitializeComponent();
this.Loaded += MainPage_Loaded;
}
private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
ReadTitle();
}
private async void ReadTitle()
{
var voice = SpeechSynthesizer.AllVoices.First();
SpeechSynthesizer reader = new SpeechSynthesizer() { Voice = voice };
var text= this.GetValue(AutomationProperties.NameProperty) as String;
await reader.SynthesizeTextToStreamAsync(text);
MediaElement.SetSource(stream, stream.ContentType);
MediaElement.Play();
}
You can read everything you want passing the string to the reader.
You need to make view-able by narrator. I don't believe you can declare the Name property within the Page Class. Try something like this within the content of your Page:
<HyperlinkButton
NavigateUri="www.bing.com"
AutomationProperties.AutomationID="bing url" //Not Required to work
AutomationProperties.Name="Go to the Bing Homepage"//Narrator will read this
<StackPanel>
<TextBlock Text="Bing Dot Com" />
<TextBlock Text="www.bing.com" />
<StackPanel>
</HyperlinkButton>
https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.automation.peers.accessibilityview
EDIT: You may also need to programmatically set focus on the item for this to work

Data binding property not working

first of all sorry for my english.
I am developing a WP7 app, and I still haven't completely understood the data binding structure. I have a page that has some data obtained through data binding. Data is generated within the .cs, and it works fine.
But on another page I have some data that is obtained from data binding too, but I want it to come from a UI input text instead. It's simple, just a textbox and a textblock, so the user writes something on the textbox and so it shows up on the textblock that's on the same page. But it's not working, the textblock remains empty.
It's something like this:
<TextBox Name="TestInput">
<TextBlock Text="{Binding TestText}">
Above is what's on the XAML.
public partial class NewItem : PhoneApplicationPage
{
public String TestText { get; set; }
public NewItem()
{
InitializeComponent();
TestText = "TestInput.Text";
}
}
And this above is what's on the C#.
BUT!! It doesn't end here. Since the textblock wasn't showing anything, I ended desperately trying to assign some plain String to the TestText property. Like this:
TestText = "HELLO WORLD";
But when the app starts and the page loads, the textblock shows nothing. I just don't understand what am I missing, or doing wrong.
I will appreciate if someone could clear me up the databinding structure, or at least explain me what did I do wrong so I can figure it out myself.
Thanks in advance guys!
You have to assign the DataContext before you want the binding effect.So whenever there is a change in the text box, you write the code in the textchanged event.
this.DataContext=TestText
And one more change that you need to perform is that you are not actually setting the property.It should be like
TestText=TestInput.Text
for your understanding of binding i am putting a simple working example..just follow this..
this is you page on which you bind the data of textbox to someproperty textboxText..when you finished writing in this textbox.then all the writtentext automatically come ino this property. and this property is also binded to textbloack so when your textbloack got focus it will got to the get of the property and automatically fill it.
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<StackPanel Orientation="Horizontal" >
<TextBox x:Name="testTextbox" Height="50" Width="200" Text="{Binding TextboxText,Mode=TwoWay}" />
<TextBlock x:Name="testTextblock" Height="50" Width="1000" Text="{Binding TextboxText,Mode=OneWay}" Foreground="White" />
</StackPanel>
</Grid>
this is your page.cs class in which i have also shown you how to implement inotifyproperty changed..it will help you in future..
public sealed partial class MainPage : Page,INotifyPropertyChanged
{
public MainPage()
{
this.InitializeComponent();
this.DataContext = this;
}
private string _TextboxText;
public string TextboxText
{
get
{
return _TextboxText;
}
set
{
_TextboxText = value;
FirePropertyChanged("TextboxText");
testTextblock.UpdateLayout();
}
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
}
public event PropertyChangedEventHandler PropertyChanged;
protected void FirePropertyChanged(string propertyName)
{
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}

How to pass a parameter in a button and get value in the code behind to redirect to another page based on the value of parameter in windows phone 7?

I am thinking if the windows phone 7 button event is similar to ASP.NET development with C#, something like in the button, I set value to commandparameter in the XAML, and in the code behind, I get the commandparameter and redirect the page.
I haven't found any good examples for button event handling, any suggestions?
Thank you.
For the xaml:
<Button Tag="pageAddress" Click="Button_Click" />
And then on the code-behind:
private void Button_Click(object sender, RoutedEventArgs e)
{
Button _button = (Button)sender;
NavigationService.Navigate(new System.Uri(_button.Tag.ToString()));
}
I would recommend you use a command parameter as you mentioned. So in your xaml do something like this:
<Button x:name="myButton" CommandParameter="{Binding Title}" Click="myButton_Click"/>
And in your C# code something like this:
private void myButton_Click(object sender, RoutedEventArgs e)
{
Button _myButton = (Button)sender;
string value = _myButton.CommandParameter.ToString();
}
Really it's pretty similar to Teemu's answer although I must admit I haven't used the Tag
element before. According to the documentation on MSDN, the Tag element should work pretty nicely as it can store custom information that you can access in your code behind (or viewmodel).

How to create a small Windows Phone 7 app with click event

I am a newbie in windows phone app and need to create a small Windows Phone 7 app. The app will perform the following task
App Screen has an image "image1' ,when i press on 'image1' it will shows a second image 'image2'
When I press on image2 it will shows image1 and so on
My XAML code
<Button Click="Button_Click">
<Image Source="resourse/image1.jpg"/>
</Button>
C# code
namespace Test
{
public partial class MainPage : PhoneApplicationPage
{
public MainPage()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
// here will shows the 'image2' and also give click event to turn 'image1'
}
}
}
Please help
I would tackle this by having a couple of images in your XAML:
<Button Click="Button_Click">
<Grid>
<Image x:Name="imageOne" Source="resourse/image1.jpg"/>
<Image x:Name="imageTwo" Source="resourse/image2.jpg"
Visibility="Collapsed"/>
</Grid>
</Button>
The use of x:Name causes visual studio to generate a field for each image. The second image is 'collapsed', i.e. hidden.
You click handler then does the following:
private void Button_Click(object sender, RoutedEventArgs e)
{
if (imageOne.Visisbility == Visibility.Visible)
{
imageOne.Visisbility = Visibility.Collapsed
imageTwo.Visisbility = Visibility.Visible
}
else
{
imageOne.Visisbility = Visibility.Visible
imageTwo.Visisbility = Visibility.Collapsed
}
}
On each click it toggled the visibility of each image.
This is easier than changing the Source of the image, which involves URIs etc...

Resources