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...
Related
Recently I have switched to Xamarin.Forms 2.4.0.18342 and now on iOS (10 and 11) the default white background for Entry controls is lost if the control was hidden and then shown.
A simple layout:
<StackLayout Orientation="Vertical" Padding="50">
<Button Text="Hide" Clicked="OnHideClicked"/>
<Button Text="Show" Clicked="OnShowClicked"/>
<Entry x:Name="PasswordEntry" Placeholder="Password" HeightRequest="44" AutomationId="PasswordStyleId" IsVisible="true"/>
</StackLayout>
looks like this:
But if I tap the Hide and then Show buttons with the following code behind:
void OnHideClicked(object sender, System.EventArgs e)
{
PasswordEntry.IsVisible = false;
}
void OnShowClicked(object sender, System.EventArgs e)
{
PasswordEntry.IsVisible = true;
}
the white background is no longer there:
Update 1
It works fine on Xamarin.Forms 2.3.4.270, but breaks on 2.4.0.280.
Update 2
Xamarin Bug: 60261
When using MasterDetailPage in Xamarin.Forms it behaves as aspected in Android. Just like a normal Navigation Drawer. Please notice the correct behaviour of the slide-in mechanism and the correct placement of the hamburger-button. The Buttons in the menu work great as well.
The UWP App looks like this. Notice, there is no hamburger-button:
After klicking on a menu-button, the menu is gone without a possibility to get it back:
Here are some code excerpts:
App.xaml.cs
public partial class App : Application
{
public App()
{
MainPage = new NavigationPage(new MenuPage());
}
...
MenuPage.xaml
<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="WordDeck.MenuPage"
xmlns:local="clr-namespace:WordDeck;assembly=WordDeck"
Title="WordDeck."
MasterBehavior="Default">
<MasterDetailPage.Master>
<ContentPage Title="Menu">
<StackLayout Orientation="Vertical">
<Button Text="Neues Spiel"
Clicked="MainPage_Clicked"></Button>
<Button Text="Deck Verwaltung"
Clicked="DeckManager_Clicked"></Button>
</StackLayout>
</ContentPage>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<local:MainPage></local:MainPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
MenuPage.xaml.cs
public partial class MenuPage : MasterDetailPage
{
public MenuPage()
{
InitializeComponent();
}
private void MainPage_Clicked(object sender, EventArgs e)
{
Detail = new MainPage();
Title = "WordDeck.";
IsPresented = false;
}
private void DeckManager_Clicked(object sender, EventArgs e)
{
Detail = new DeckManagerPage();
Title = "Deck Verwaltung";
IsPresented = false;
}
}
MainPage and DeckManagerPage are nearly empty and of type ContentPage.
Why is there no menu Button on UWP?
It's because you're running the UWP app as a desktop app and not on the phone. If you run the app on a mobile phone or emulator you should see the menu as on Android.
If you want to use the hamburger behaviour when running as a desktop app set MasterBehavior = MasterBehavior.Popover on your MasterDetailPage
The main problem is the IsPresented on the desktop hides the drawer.
One way to handle this is not to hide on desktop or tablet.
For example...
// Called from each Clicked Event
private void SetPresentedVisability()
{
switch (Device.Idiom)
{
case TargetIdiom.Phone:
IsPresented = false;
break;
case TargetIdiom.Desktop:
case TargetIdiom.Tablet:
case TargetIdiom.Unsupported:
IsPresented = true;
break;
}
}
Alternately you could ignore any non phone IsPresented setting.
IsPresented = (Device.Idiom == TargetIdiom.Phone) ? false : true;
I am new in Xamarin and I want to go to another screen from one screen. I have a button in first screen and I want to open another screen after clicking on that button.
How can I do this?
Here is the code I have tried so far:
XAML Layout (FirstXAML.xaml)
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="AllControlsDemo.FirstXaml">
<StackLayout>
<Slider x:Name="sldr"
VerticalOptions="CenterAndExpand"
ValueChanged="OnSliderValueChanged" />
<Label x:Name="lblValue"
Text="A simple Label"
Font="Large"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
<Button x:Name="btnClickme"
Text="Click Me!"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand"
Clicked="OnbtnClickme" />
<Button x:Name="btnSecondXaml"
Text="Second Xaml!"
HorizontalOptions="Center"
VerticalOptions="StartAndExpand"
Clicked="OnbtnSecondXaml" />
</StackLayout>
</ContentPage>
Code of (FirstXAML.xaml.cs)
using System;
using System.Collections.Generic;
using Xamarin.Forms;
namespace AllControlsDemo
{
public partial class FirstXaml : ContentPage
{
private Label valueLabel;
float count = 0.050f;
private Slider slider;
public FirstXaml ()
{
InitializeComponent ();
valueLabel = this.FindByName<Label>("lblValue");
slider = this.FindByName<Slider> ("sldr");
}
void OnSliderValueChanged(object sender, ValueChangedEventArgs args)
{
valueLabel.Text = ((Slider)sender).Value.ToString("F3");
count = float.Parse(valueLabel.Text);
}
void OnbtnClickme(object sender, EventArgs args)
{
count += 0.050f;
slider.Value = count;
}
void OnbtnSecondXaml(object sender, EventArgs args)
{
// Write code here to move on second Xaml
}
}
}
I am also new on Xamarin. I copied your code and solved your problem.
Try this:
void OnbtnSecondXaml(object sender, EventArgs args)
{
// Write code here to move on second Xaml
Navigation.PushModalAsync(new SecondXaml());
}
This is what NavigationPage is for. You need to wrap FirstXAML inside of a NavigationPage, then you can use the Navigation property to navigate to other pages.
Navigation.PushAsync(page2);
Also, you do not need to use FindByName to assign local variables for controls in your xaml. Any control with a x:name property will automatically be assigned a local variable.
I am new to creating Windows Phone 7 Apps, I have added a slider to my page to which i have customized the look but when i load the page in the emulator before the page even loads I get a "NullReferenceException" I thought this was because I had not initialized the slider so i changed the settings method to
public settings()
{
InitializeComponent();
sldPassLegnth.Value = (double)3;
}
The value changed event simply looks like this:
private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
double d;
d = sldPassLegnth.Value;
}
The xaml for the slider is:
<Slider Style="{StaticResource SliderStyle1}" Margin="24,75,22,352" Name="sldPassLegnth" ValueChanged="Slider_ValueChanged" Background="Black" Foreground="#FF3399FF" Maximum="15" Minimum="3" />
Any insight into this would be great! Thanks in advance.
Try this instead:
private void Slider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
{
double d;
d = e.NewValue;
}
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.