I was trying to use the settings flyout in phone 8.1 runtime to produce a settings screen for an app. However the compiler is throwing an error and I dont no why. This would have worked fine in phone 8.0 but not 8.1 runtime it seems.
<SettingsFlyout
x:Class="popcornpk.Settings"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:popcornpk"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
IconSource="Assets/SmallLogo.png"
Title="CustomSetting" >
<!-- This StackPanel acts as a root panel for vertical layout of the content sections -->
<StackPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" >
<!-- Toggle switch -->
<StackPanel >
<TextBlock Text="Toggle Switch" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Margin="0,0,0,25" Text="Use toggle switches to let users set Boolean values." Style="{StaticResource BodyTextBlockStyle}"/>
<ToggleSwitch Margin="-6,0,0,0" Header = "Download updates automatically" HorizontalAlignment="Left" HorizontalContentAlignment="Left"/>
<ToggleSwitch Margin="-6,0,0,0" Header = "Install updates automatically" HorizontalAlignment="Stretch"/>
</StackPanel>
<!-- Button -->
<StackPanel >
<TextBlock Text="Push button" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Text="Button label" Style="{StaticResource BodyTextBlockStyle}"/>
<Button Margin="-3,0,0,0" Content="Clear"/>
<TextBlock Margin="0,0,0,25" Text="With a push button, users initiate an immediate action." Style="{StaticResource BodyTextBlockStyle}"/>
</StackPanel>
<!-- ComboBox -->
<StackPanel >
<TextBlock Text="ComboBox" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Margin="0,0,0,25" Text="Use the ComboBox to allow users to select one item from a set of text-only items." Style="{StaticResource BodyTextBlockStyle}"/>
<ComboBox Header="State:" Margin="0,7,0,0" SelectedIndex="0" HorizontalAlignment="Left">
<ComboBoxItem Content="Washington"/>
<ComboBoxItem Content="Oregon"/>
<ComboBoxItem Content="California"/>
</ComboBox>
</StackPanel>
<!-- HyperlinkButton -->
<StackPanel >
<TextBlock Text="Hyperlink" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Margin="0,0,0,25" Text="Use a hyperlink when the associated action will take the user out of this flyout." Style="{StaticResource BodyTextBlockStyle}"/>
<HyperlinkButton Padding="-5,0,0,0" Content="View privacy statement" Tag="http://privacy.microsoft.com" HorizontalAlignment="Left"/>
</StackPanel>
<!-- TextBox -->
<StackPanel >
<TextBlock Text="TextBox" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Margin="0,0,0,25" Text="Use a TextBox to allow users to enter text." Style="{StaticResource BodyTextBlockStyle}"/>
<StackPanel Margin="0,7,0,0" Orientation="Horizontal">
<TextBox HorizontalAlignment="Left" Width="150"/>
<Button Margin="20,0,0,0" Content="Add"/>
</StackPanel>
</StackPanel>
<!-- RadioButton -->
<StackPanel>
<TextBlock Text="Radio button group" Style="{StaticResource TitleTextBlockStyle}"/>
<TextBlock Margin="0,0,0,25" Text="Lets users choose one item from a small set of mutually exclusive, related options." Style="{StaticResource BodyTextBlockStyle}"/>
<TextBlock Text="Video quality" Style="{StaticResource BodyTextBlockStyle}"/>
<RadioButton Margin="0,7,0,0" Content="High"/>
<RadioButton Margin="0,17,0,0" Content="Medium"/>
<RadioButton Margin="0,17,0,0" Content="Low"/>
</StackPanel>
</StackPanel>
Severity Code Description Project File Line
Error CS0263 Partial declarations of 'Settings' must not specify different base classes popcornpk C:\Users\david\Documents\Visual Studio 2015\81StoreLiveAppsPhoneOnlyLIVE\popcornpk\popcornpkhub\popcornpk\popcornpk\obj\Debug\Settings.g.i.cs 15
My base class is just the same as other pages
Note 2
public partial class Settings : Page
I changed above to settings and it compiled but the flyount did not work or popup so it didnt any idea as to why it didnt.
Note 2
To Avoid confusion I dont want a base page of page I wanted to be able to use the settingsflyout that was part of 8.0 apparently microsoft have dicthced this though for 8.1 UAP
The exception tells you everything you need to know.
Look at your xaml. Here's the top two lines of your file:
<SettingsFlyout
x:Class="popcornpk.Settings"
This says that you're declaring a new class called popcornpk.Settings (btw, namespaces should be PascalCased) that extends the base class SettingsFlyout.
When you add a new xaml file to your application, it actually creates three files--the .xaml file, a .xaml.cs file that you edit, and a mysterious ephemeral .g.i.cs file that holds designer-generated code (e.g., the implementation of InitializeComponent()).
The .xaml.cs and .g.i.cs files are partial class files, and are combined by the compiler. Note what the exception message says--
Partial declarations of 'Settings' must not specify different base classes
What are these different base classes?
Well, from the xaml, we can see the first one--SettingsFlyout.
From your snippet,
public partial class Settings : Page
We see the other base class--Page.
Not sure how you screwed that up, but the simple fix is to remove the base class declaration from your .xaml.cs file:
public partial class Settings
{
// snip
Apart from what Will has said about partial classes, which will surely solve the error, you probably won't be able to use SettingsFlyout on Phone - following the remarks:
Caution SettingsFlyout is supported only for use with the SettingsPane in Windows 8. While the SettingsFlyout type is visible in Windows Phone projects, SettingsPane is not present on Windows Phone, so use of SettingsFlyout is not supported.
Related
I have defined a "Toggle" textblock inside three buttons. I am getting an error that the name "Toggle" Is already defined in the innermost scope of the second and third buttons.
Shouldn't they not be defined in the same scope? It seems they are...
If this is not the way to do it, how can one simply define similar items (Similar to how there can be an id property in css) so one can access the inside of each button via one same identifier in the code behind?
<Button Name="OutputButton" Margin="5" Width="150" Click="OutputToggle_Click" TabIndex="0" HorizontalAlignment="Center">
<TextBlock Name="OutputText" HorizontalAlignment="Center">RF
<TextBlock Name="Toggle" HorizontalAlignment="Left"></TextBlock>
</TextBlock>
</Button>
<Button Name="ModulationButton" Margin="5" Width="Auto" HorizontalAlignment="Left" Click="ModulationToggle_Click" IsEnabled="False" TabIndex="0">
<TextBlock Name="ModulationToggleText" Margin="3">Load Waveform to enable MOD
<TextBlock Name="Toggle"></TextBlock>
</TextBlock>
</Button>
<Button Name="LOSharingButton" Margin="5" Width="150" HorizontalAlignment="Left" Click="AutomaticLOSharingButton_Click">
<TextBlock Name="LOSharingText">LO Sharing
<TextBlock Name="Toggle"></TextBlock>
</TextBlock>
</Button>
The answer to this is to use the tag property of a textblock. This is very similar to the id property in css, but takes a little more effort to find.
I'm building a UWP in C# with Visual Studio, and need to hide and show a NavigationView, named 'navigationView' as required.
I am using the property .IsPaneVisible to achieve this, but am encountering a strange bug:
I can set IsPaneVisible = true or false in the xaml document, but if I set navigationView.IsPaneVisible = false; in the related C# document, and run a debug build of the app from Visual Studio, the app crashes with the error
System.ArgumentException: 'The parameter is incorrect.
Even stranger, if I run the same debug build, but launched directly, outside Visual Studio, the app functions normally without crashing at this line.
Does anyone have an idea of why this might be happening or how I could fix it?
Here's the xaml code:
<Page
x:Class="Sheet_Music_Reader.Views.ShellPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:i="using:Microsoft.Xaml.Interactivity"
xmlns:behaviors="using:Sheet_Music_Reader.Behaviors"
xmlns:winui="using:Microsoft.UI.Xaml.Controls"
xmlns:helpers="using:Sheet_Music_Reader.Helpers"
xmlns:views="using:Sheet_Music_Reader.Views"
Loaded="OnLoaded"
mc:Ignorable="d">
<Page.Resources>
<!--This top margin is the height of the custom TitleBar-->
<Thickness x:Key="NavigationViewContentMargin">0,48,0,0</Thickness>
<Thickness x:Key="NavigationViewContentGridBorderThickness">0</Thickness>
<SolidColorBrush x:Key="NavigationViewContentBackground" Color="Transparent"></SolidColorBrush>
</Page.Resources>
<Grid>
<Border x:Name="AppTitleBar"
IsHitTestVisible="True"
VerticalAlignment="Top"
Background="Transparent"
Height="40"
Canvas.ZIndex="1"
Margin="48,8,0,0">
<StackPanel Orientation="Horizontal">
<Image x:Name="AppFontIcon"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Source="Assets/Square44x44Logo.png"
Width="16"
Height="16"/>
<TextBlock x:Name="AppTitle"
Text="enScore"
VerticalAlignment="Center"
Margin="12,0,0,0"
Style="{ThemeResource CaptionTextBlockStyle}"/>
</StackPanel>
</Border>
<winui:NavigationView
IsBackButtonVisible="Visible"
IsBackEnabled="{x:Bind IsBackEnabled, Mode=OneWay}"
SelectedItem="{x:Bind Selected, Mode=OneWay}"
ItemInvoked="OnItemInvoked"
IsSettingsVisible="True"
IsTitleBarAutoPaddingEnabled="False"
DisplayModeChanged="NavigationViewControl_DisplayModeChanged"
Canvas.ZIndex="0"
x:Name="navigationView">
<winui:NavigationView.MenuItems>
<winui:NavigationViewItem x:Uid="Shell_Main" Icon="Copy" helpers:NavHelper.NavigateTo="views:MainPage" />
</winui:NavigationView.MenuItems>
<i:Interaction.Behaviors>
<behaviors:NavigationViewHeaderBehavior
DefaultHeader="{x:Bind Selected.Content, Mode=OneWay}">
<behaviors:NavigationViewHeaderBehavior.DefaultHeaderTemplate>
<DataTemplate>
<Grid x:Name="headerGrid">
<TextBlock
Text="{Binding}"
Style="{ThemeResource TitleTextBlockStyle}"
Margin="{StaticResource SmallLeftRightMargin}" />
<Button Style="{ThemeResource ButtonRevealStyle}" Content="Refresh Library Contents" HorizontalAlignment="Right" Margin="0,45,8,0" Click="RefreshLibrary"/>
<Button Style="{ThemeResource ButtonRevealStyle}" Content="Import PDF To Current Folder" HorizontalAlignment="Right" Margin="0,-35,140,0" Click="AddScore"/>
<Button Style="{ThemeResource ButtonRevealStyle}" Content="Add New Folder" HorizontalAlignment="Right" Margin="0,-35,8,0" Click="AddFolderAsync"/>
<ToggleButton Style="{ThemeResource ToggleButtonRevealStyle}" x:FieldModifier="public" x:Name="tbtndelete" Content="Delete Items" HorizontalAlignment="Right" Margin="0,45,191,0" Tapped="DeleteItem"/>
</Grid>
</DataTemplate>
</behaviors:NavigationViewHeaderBehavior.DefaultHeaderTemplate>
</behaviors:NavigationViewHeaderBehavior>
</i:Interaction.Behaviors>
<Grid>
<Frame x:Name="shellFrame" />
</Grid>
</winui:NavigationView>
</Grid>
</Page>
Try to change the placement of the menu with:
PaneDisplayMode="Top"
For my case with Microsoft.UI.Xaml.Controls for Microsoft.WindowsAppSDK v1.0.0.
the showing/hidding of menu bar works fine.
Left, LeftMinimal, LeftCompact crashes the app.
I know you may expect the menu on the left, but still on the top is not that bad idea ;-) At least it works.. Greetz.
I am building a WPF application and I would like to have custom MessageBox but I saw that is really tedious and I thought of using the DialogHost provided by MaterialDesign. The problem is that I can't get it to work the way I want it to so let me describe the current behaviour and the wanted one.
The current behaviour:
<materialDesign:ColorZone Grid.Column="1"
Grid.ColumnSpan="2"
Grid.Row="1"
Mode="Light"
Padding="16">
<DockPanel>
<materialDesign:DialogHost DockPanel.Dock="Right">
<Button x:Name="PowerButton"
ToolTip="{Binding PowerButtonToolTip, Source={StaticResource ResourceKey=ButtonsResources}}"
Style="{StaticResource MaterialDesignIconButton}"
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}">
<Button.CommandParameter>
<StackPanel>
<TextBlock Text="TODO" />
<StackPanel Orientation="Horizontal"
Margin="0, 20, 0, 10">
<Button Width="90"
Height="30"
Margin="10, 0, 0, 0"
Style="{StaticResource MaterialDesignOutlinedButton}"
Click="PowerButton_Click">
OK
</Button>
<Button Width="90"
Height="30"
Margin="10, 0, 10, 0"
Style="{StaticResource MaterialDesignOutlinedButton}"
Command="{x:Static materialDesign:DialogHost.CloseDialogCommand}">
CANCEL
</Button>
</StackPanel>
</StackPanel>
</Button.CommandParameter>
<materialDesign:PackIcon Kind="Power" />
</Button>
</materialDesign:DialogHost>
<StackPanel Orientation="Horizontal">
<ToggleButton x:Name="MenuButton"
Style="{DynamicResource MaterialDesignHamburgerToggleButton}" />
<TextBlock VerticalAlignment="Center"
Margin="16 0 0 0"
Text="{Binding MainViewTitle, Source={StaticResource ResourceKey=ViewsResources}}">
</TextBlock>
</StackPanel>
</DockPanel>
</materialDesign:ColorZone>
What happens is that when I'm clicking the PowerButton the DialogHost appears with the structure from the Button.CommandParameter. The issue with this is that the window doesn't get "disabled" (getting a little black and unclickable) while the dialogue is on.
I saw that to achieve this behaviour I need to but all the content of the window inside the DialogHost. But is it really so or I am misunderstanding something? Their example (see link) isn't really helpful because there seem to be other things running in the background. Moreover, the command materialDesign:DialogHost.OpenDialogCommand of the button that is opening the "Topmost dialogue host" seems limited to me.
Let's try something simple fo you to try at the first time.
The DialogHost is composed of two major parts
First everything that is displayed into your DialogHost, this have to be into one block (StackPanel, Grid, DockPanel...) that is the content of your DialogHost.
Second part is more like the context of your dialog, when you want to display it have to be somewhere to be displayed, another block (StackPanel, Grid, DockPanel...), the context is the place where your dialog will be once displayed, il will show centered and darken the rest of the block.
Now you have the main theory let's make a simple sample based on the sample given by the demo and your piece of code.
<materialDesign:DialogHost HorizontalAlignment="Center" VerticalAlignment="Center">
<materialDesign:DialogHost.DialogContent>
<StackPanel Margin="16">
<!-- HERE GOES YOUR CONTENT -->
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right" >
<Button Style="{StaticResource MaterialDesignFlatButton}" IsDefault="True"
Margin="0 8 8 0" Command="materialDesign:DialogHost.CloseDialogCommand">
<Button.CommandParameter>
<system:Boolean>True</system:Boolean>
</Button.CommandParameter>
ACCEPT
</Button>
<Button Style="{StaticResource MaterialDesignFlatButton}"
IsCancel="True" Margin="0 8 8 0"
Command="materialDesign:DialogHost.CloseDialogCommand">
<Button.CommandParameter>
<system:Boolean>False</system:Boolean>
</Button.CommandParameter>
CANCEL
</Button>
</StackPanel>
</StackPanel>
</materialDesign:DialogHost.DialogContent>
<!-- START OF YOUR CONTEXT-->
<!-- END OF YOUR CONTEXT -->
</materialDesign:DialogHost>
So now you have the basis that may be enough for you to start enjoying.
A little more, your context need to be large enough to display what you put on your DialogHost so you can't put a whole dialog around a button, it is better to make it around something bigger, as a first try you should try on a new page to test this context :
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Button x:Name="PowerButton" ToolTip="{Binding PowerButtonToolTip, Source={StaticResource ResourceKey=ButtonsResources}}"
Style="{StaticResource MaterialDesignIconButton}"
Command="{x:Static materialDesign:DialogHost.OpenDialogCommand}">
</Grid>
The Buttons under the content are simply there if you desire to do an action, for example if the DialogHost is there for a modification or a choice where the user can say Yes or No then rename ACCEPT and CANCEL as you want. The "IsDefault" is there to make that it is this button that is considered as pressed if the user press Enter. Pressing a button automatically close the Dialog that is good to know.
And as the both ACCEPT and CANCEL are button you can affect a Click event that will be pretty useful for advanced using of the DialogHost.
Porting an iOS app and I may be abusing the hub control; but I have a very simple app where I'd like a form to be in a hub section. However it seems like it must be wrapped in a DataTemplate and once it is the form's TextBox controls do not show up in the code behind C# file?
<HubSection x:Uid="HubSection1" Header="SETTINGS"
DataContext="{Binding Groups[2]}" HeaderTemplate="{ThemeResource HubSectionHeaderTemplate}">
<DataTemplate>
<StackPanel VerticalAlignment="Top" Margin="0,0,20,0">
<TextBlock Text="api base uri" FontSize="21" TextWrapping="NoWrap"/>
<TextBox Name="apiBaseUriTextBox" Margin="0,0,0,10" TextWrapping="Wrap" PlaceholderText="api base uri" VerticalAlignment="Stretch"/>
<TextBlock Text="api key" FontSize="21" TextWrapping="NoWrap" Margin="0,0,0,10"/>
<TextBox Name="apiKeyTextBox" Margin="0,0,0,10" TextWrapping="Wrap" PlaceholderText="api key" VerticalAlignment="Stretch"/>
<TextBlock Text="api secret" FontSize="21" TextWrapping="NoWrap"/>
<TextBox Name="apiSecretTextBox" Margin="0,0,0,10" TextWrapping="Wrap" PlaceholderText="api secret" VerticalAlignment="Stretch"/>
<Button Click="SettingsSaveClickHandler"
Content="Save" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0,20,0,0"/>
</StackPanel>
</DataTemplate>
</HubSection>
If you want to put the form directly in the HubSection's DataTemplate then the best way to access the values is by data binding the TextBoxes to properties in your DataContext. The other option would be to crawl the visual tree by calling the VisualTreeHelper from your button's SettingsSaveClickHandler
Another option would be to create your form as a UserControl and then host the completed form in the HubSection's DataTemplate. Again, you can bind it to the DataContext to connect to the underlying data.
I have a bunch (currently) HyperlinkButtons on my main web page. I want to have 2 versions for the image of each button: selected and unselected. This way when the users enters a page the corresponding button will change to the "selected" image.
Here is an image of what I want to accomplish:
This seems to me like something trivial, but so far I have been running into a stone wall.
I would prefer to do everything from the XAML (but I will be grateful for any solution).
Here is a little of my XAML:
<ScrollViewer x:Name="NavScrollViewer" Margin="-5,12,5,-12" ScrollViewer.VerticalScrollBarVisibility="Visible" IsEnabled="True"
Style="{StaticResource ContentViewerStyle}">
<StackPanel x:Name="ToolboxPanel" Orientation="Vertical" d:LayoutOverrides="Width" Height="Auto">
<HyperlinkButton x:Name="DashboardButton"
Content="Assets/icon_dashboard.png"
Style="{StaticResource ToolStyle}"
TargetName="ContentFrame"
NavigateUri="/Dashboard"
Height="50"
/>
<TextBlock Text="Dashboard" HorizontalAlignment="Center" Height="20" Style="{StaticResource ComponentNameStyle}"/>
<HyperlinkButton x:Name="ConfigurationButton"
Content="Assets/icon_dashboard.png"
Style="{StaticResource ToolStyle}"
TargetName="ContentFrame"
NavigateUri="/CRSConfiguration"
Height="50"
/>
<TextBlock Text="Configuration" HorizontalAlignment="Center" Height="20" Style="{StaticResource ComponentNameStyle}"/>
<HyperlinkButton x:Name="ScanEnginestionButton"
Content="Assets/icon_dashboard.png"
Style="{StaticResource ToolStyle}"
TargetName="ContentFrame"
NavigateUri="/ScanEngines"
Height="50"
/>...
You need to have a toggle button and set its IsChecked property to toggle among its visual states. You may go through this post Using Toggle Button