Windows Phone C# - Settings Page - Initialization

Question

I am creating a Windows Phone Application but i have a small problem.

I am using the AppSettings Class from MSDN samples to save my settings and this is working fine.

BUT, inside my settings UI i have a Radio Inputs. When each Radio Input is being checked i want to make Visibility.Collaped or Visibility.Visible a TextBox. It does not allow me to do this beucause i guess when the AppSettings is being initialized and a Radio Input is checked every toolbox is null.

The Settings page is being initialized after the AppSettings so how i am gonna do this?

If i run the below code it gives me nullreferenceexception in the line:

 EnterRadiusBox.Visibility = Visibility.Collapsed;

I hope you understand me.

Here is the Code i Have So Far in The Settings Page:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Navigation;
    using Microsoft.Phone.Controls;
    using Microsoft.Phone.Shell;

    namespace MyAPP
    {
        public partial class Page1 : PhoneApplicationPage
        {
            public Page1()
            {
                InitializeComponent();
            }

            private void OffersFromRadius_Checked(object sender, RoutedEventArgs e)
            {
                EnterRadiusBox.Visibility = Visibility.Visible;
                RadiusExplain.Visibility = Visibility.Visible; 
            }

            private void OffersFromCity_Checked(object sender, RoutedEventArgs e)
            {
                EnterRadiusBox.Visibility = Visibility.Collapsed;
                RadiusExplain.Visibility = Visibility.Collapsed;          
            }
        }
    }

And Here is my Settings.xaml

    <phone:PhoneApplicationPage
        x:Class="MyAPP.Page1"
        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"
        FontFamily="{StaticResource PhoneFontFamilyNormal}"
        FontSize="{StaticResource PhoneFontSizeNormal}"
        Foreground="{StaticResource PhoneForegroundBrush}"
        SupportedOrientations="Portrait" Orientation="Portrait"
        mc:Ignorable="d"
        xmlns:local="clr-namespace:SettingsHandle"
        ApplicationBar = "{StaticResource GlobalAppBar}"
        shell:SystemTray.IsVisible="True">

        <phone:PhoneApplicationPage.Resources>
            <local:AppSettings x:Key="appSettings"></local:AppSettings>
        </phone:PhoneApplicationPage.Resources>

        <!--LayoutRoot is the root grid where all 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 Grid.Row="0" Margin="12,17,0,28">
                <TextBlock Text="MyAPP" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock Text="Settings" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>

            <!--ContentPanel - place additional content here-->
            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="14,0,10,0">
                <TextBlock HorizontalAlignment="Left" Margin="151,27,0,0" TextWrapping="Wrap" Text="Show Offers From" VerticalAlignment="Top" Height="30" Width="167"/>
                <RadioButton x:Name="OffersFromCity" Content="My City" HorizontalAlignment="Left" Margin="67,57,0,0" VerticalAlignment="Top" RenderTransformOrigin="0.818,0.428" GroupName="GroupOne" IsChecked="{Binding Source={StaticResource appSettings}, Path=OffersFromCitySetting, Mode=TwoWay}" Checked="OffersFromCity_Checked" />
                <RadioButton x:Name="OffersFromRadius" Content="A Radius" HorizontalAlignment="Left" Margin="246,57,0,0" VerticalAlignment="Top" GroupName="GroupOne" IsChecked="{Binding Source={StaticResource appSettings}, Path=OffersFromRadiusSetting, Mode=TwoWay}" Checked="OffersFromRadius_Checked"  /> 
                <TextBox x:Name="EnterRadiusBox" HorizontalAlignment="Left" Height="72" Margin="92,124,0,0" TextWrapping="Wrap" Text="60" VerticalAlignment="Top" Width="296" InputScope="Number" />
                <TextBlock x:Name="RadiusExplain" HorizontalAlignment="Left" Margin="56,196,0,0" TextWrapping="Wrap" Text="I want to hide this value or make it visible." VerticalAlignment="Top" Height="84" Width="364" />
            </Grid>


        </Grid>

    </phone:PhoneApplicationPage>

Answer 1

This should better be solved with XAML bindings, instead of C# code.

Add the Cimbalino lib to your project or add a BooleanToVisibilityConverter on your own.

If you use Cimablino, add the following namespace to the <Application ...></Application> root node inside your App.xaml:

xmlns:conv="clr-namespace:Cimbalino.Phone.Toolkit.Converters;assembly=Cimbalino.Phone.Toolkit"

and add this converter below <Application.Resources> in the App.xaml:

<conv:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />

Then you can bind the visibility of your TextBox/TextBlock to the matching Radiobox in your own code:

<RadioButton x:Name="OffersFromCity" GroupName="GroupOne" ... />
<RadioButton x:Name="OffersFromRadius" GroupName="GroupOne" ... /> 
<TextBox x:Name="EnterRadiusBox" Visibility="{Binding IsChecked, ElementName=OffersFromRadius, Converter={StaticResource BooleanToVisibilityConverter}}" ... />
<TextBlock x:Name="RadiusExplain" Visibility="{Binding IsChecked, ElementName=OffersFromRadius, Converter={StaticResource BooleanToVisibilityConverter}}" ... />

In the Binding of the Visibility you say that the property IsChecked from the element with the name OffersFromRadius should be used. Because the Visibility property does not know what a bool is, we need the converter. This converter translates the bool to the matching Visibility.