how can i set header templete in pivot item at run time - windows-phone

actually i want to set image on header of every pivot item .....at run time using a resource
<UserControl x:Class="WindowsPhoneApplication7.heder"
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"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="18" d:DesignWidth="24" Loaded="UserControl_Loaded">
<UserControl.Resources>
<DataTemplate x:Key="heder_image">
<Image Source="/WindowsPhoneApplication7;component/Images/appbar.feature.settings.rest.png"></Image>
</DataTemplate>
</UserControl.Resources>
it is a resource
now my pivot item are in another cs file
heder dis =new heder();
pivotItem[i] = new PivotItem();
pivotItem[i].Header = (DataTemplate)dis.Resources["heder_image"];
but the header templte r not set ......image r not display

What you're doing wrong here, is that you're setting the Header of a PivotItem to a template, instead of using the Pivot.HeaderTemplate. That way it wouldn't be necessary to generate the items in C# either, but instead databind (via. the Pivot.ItemsSource property) them, and do all the styling in XAML as you're meant to do.
And when that is said, using a image for a Pivot Header, should really be discouraged, as it goes against the platforms default look&feel, and thus against the platforms UI and UX guidelines.

Check if the image's Build Action is set to Content (see properties of the file in VS2010 explorer). If the image is in the same project as the XAML page, use "/Images/appbar.feature.settings.rest.png" instead of "/WindowsPhoneApplication7;component...".
Use this XAML snippet and set your header in XAML:
<controls:Pivot ItemsSource="{Binding MyObjects}" HeaderTemplate="{StaticResource heder_image}">
<controls:Pivot.ItemTemplate>
<DataTemplate>
...
</DataTemplate>
</controls:Pivot.ItemTemplate>
</controls:Pivot>

Related

How do you add varible in UWP xaml?

I want to add a variable to my xaml.
My xaml looks like this
<Page
x:Class="UwpTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:UwpTest"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:system="using:System"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<system:String x:Key="var1">1.2</system:String>
</Page.Resources>
<Grid>
</Grid>
</Page>
When run, I get runtime error.
Microsoft.UI.Xaml.Markup.ReflectionHelperException
HResult=0x80131500
Message=Error in reflection helper. Please add '<PropertyGroup><EnableTypeInfoReflection>false</EnableTypeInfoReflection></PropertyGroup>' to your project file.. Created Xaml type 'String' has a different name than requested type 'System.String'
Source=Windows
StackTrace:
at Windows.UI.Xaml.Application.LoadComponent(Object component, Uri resourceLocator, ComponentResourceLocation componentResourceLocation)
at UwpTest.MainPage.InitializeComponent() in D:\Dev\UwpTest\UwpTest\obj\x86\Debug\MainPage.g.i.cs:line 33
at UwpTest.MainPage..ctor() in D:\Dev\UwpTest\UwpTest\MainPage.xaml.cs:line 27
I want to add a variable to my xaml
You could add x:String into resource as variable for example
<x:String x:Key="var1">Hello</x:String>
For more please refer to XAML intrinsic data types

Cannot bind to button events using x:Bind in DataTemplates - generates XAML error

With the {x:Bind} markup syntax you can bind to events provided the method meets the following requirements:
Match the signature of the event.
OR have no parameters.
OR have the same number of parameters of types that are assignable from the types of the event parameters.
This works perfectly fine outside of a DataTemplate. Once the binding happens inside the DataTemplate the compiler generates the following error:
Xaml Internal Error error WMC9999: Object reference not set to an
instance of an object.
What is the fix for binding to events inside DataTemplates?
Full example code here.
Snippet of the example code below - note the first button (line 2) is fine and the second button (line 6) is also fine. If you comment out line 6 and and comment in line 7, the error occurs.
<StackPanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Button Tapped="{x:Bind Click}" Content="WORKING"/>
<ListView ItemsSource="{x:Bind Names}">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:Customer">
<Button Content="{x:Bind Title}"/>
<!--<Button Tapped="{x:Bind Clicky}" Content="{x:Bind Title}"/>-->
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
I was able to get it to work with the following code:
<DataTemplate x:DataType="local:Customer">
<StackPanel Orientation="Vertical">
<Button Tapped="{x:Bind Clicky}" Content="{x:Bind Title}" />
</StackPanel>
</DataTemplate>
It seems as though you need to have it inside a container for it work. I have no idea why I am guessing magic.
The parser cannot find Clicky from the datacontext of the button while in the template. Because the object that is being handed to the button in the template (from the Names on the ItemSource of the parent) is not the same as outside the template which has a Clicky. You will need to bind Clicky to the page's datacontext to get it to work.
Otherwise turn off any design time operations by setting Tapped="{x:Bind Clicky, IsDesignTimeCreatable=False}.

Implement IE/Microsoft Edge bottom bar in XAML

I am a huge fan of the browser on Windows phone and I want to port a similar bottom bar to my app. Right now, I am using a standard CommandBar.
<Page.BottomAppBar>
<CommandBar>
<AppBarButton Icon="Go" Click="Go"/>
<CommandBar.SecondaryCommands>
<AppBarButton Icon="Setting" Label="Settings" Click="ShowSettings"/>
</CommandBar.SecondaryCommands>
</CommandBar>
</Page.BottomAppBar>
As this wastes screen space, I really want to make use of the remaining space of the bar to add something like app status (in place of the address bar of Edge/IE), something like download/upload progress. Unfortunately, the CommandBar does not allow introducing things like TextBlock or ProgressRing. To make use of those controls, we need to change to an AppBar instead. But then, I cannot use the features of CommandBar like the adding 3 dots buttons to open up the hidden buttons.
Is there an easy way to achieve this i.e. combining the flexibility of AppBar and the 3-dot feature of CommandBar?
CommandBar only accept the control that inherit ICommandBarElement interface.
We can create one UserControl which inherit ICommandBarElement, simply did a small test without optimize the code, take a look to see if it helps:
public sealed partial class MyUserControl1 : UserControl, ICommandBarElement
{
public MyUserControl1()
{
this.InitializeComponent();
}
private bool _IsCompact = true;
bool ICommandBarElement.IsCompact
{
get
{
return _IsCompact;
}
set
{
_IsCompact = value;
}
}
}
Also the UserControl XAML:
<UserControl
x:Class="App10.MyUserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App10"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignWidth="400" Height="38.027">
<Grid>
<TextBlock Foreground="DarkBlue">asdsadasdasdasdasda</TextBlock>
</Grid>
And then we use the userControl in the CommandBar, here we go:
http://i.stack.imgur.com/Bgug9.png
Note: please further optimize it for instance register some Text dependency properties to enable accept the data binding.
Per the documentation on MSDN you can use the CommandBar.Content property which corresponds to the empty area to the side of any primary commands. To alter the alignment of the content you'd need to change the CommandBar.HorizontalContentAlignment property.
<CommandBar HorizontalContentAlignment="Stretch">
<AppBarButton Icon="Go" Click="Go"/>
<CommandBar.SecondaryCommands>
<AppBarButton Icon="Setting" Label="Settings" Click="ShowSettings"/>
</CommandBar.SecondaryCommands>
<CommandBar.Content>
<Grid>
<TextBox HorizontalAlignment="Stretch"
VerticalAlignment="Top"
Margin="12,8"/>
</Grid>
</CommandBar.Content>
</CommandBar>
And as of Win10 the recommendation is to place the CommandBar inline instead of using the Page.TopAppBar or Page.BottomAppBar properties. The one scenario in which you may still want to use the Page.BottomAppBar property is to ensure the CommandBar remains visible when the software keyboard appears.

Why is this XAML failing with "The property "Content" can only be set once."?

I've got this XAML:
<AppBarButton Icon="Protected" Label="Privacy Policy" >
<AppBarButton.Flyout>
<StackPanel>
<Flyout>
<TextBlock Text="Photrax extracts information from images you load into it. The information it extracts includes location information (where the photos were taken, when that is available) and the date and time the photo was taken. This data is stored in a local/internal/embedded (SQLite) database. This data is not stored in the cloud but only on your local device." TextWrapping="Wrap" FontSize="26" FontFamily="Verdana">
</TextBlock>
<TextBlock Text="To reiterate: Your data is not shared with anyone else. It is stored only on the device from which you use Photrax." TextWrapping="Wrap" FontSize="26" FontFamily="Verdana">
</TextBlock>
</Flyout>
</StackPanel>
</AppBarButton.Flyout>
</AppBarButton>
...which fails with, "The property "Content" can only be set once."
Why is there a problem with this, when the following XAML, which is basically the same, compiles fine:
<AppBarButton Icon="MapPin" Label="Colors In Use" Tapped="appbarbtnPhotosetColorMapping_Tapped">
<AppBarButton.Flyout>
<Flyout>
<StackPanel Background="Azure">
<TextBlock Text="Photoset:Pushpin Color Legend" TextWrapping="Wrap" FontSize="26" FontFamily="Verdana"></TextBlock>
<TextBlock x:Name="textblock0" Text="Unused" Foreground="Red" FontFamily="Segoe UI" FontSize="13" Margin="4" />
. . .
?
I get other err msgs with that xaml, too (about the following types being expected: flyoutbase and uielement), but I think it's the Content business that is giving me the business.
I pasted the problem code into kaxaml, but it doesn't even know what an AppBarButton is, and complained about that being an invalid element.
UPDATE
I can't test it yet, but I'm thinking that what Abdallah means is that I need to change this:
<StackPanel>
<Flyout>
. . .
</Flyout>
</StackPanel>
...to this:
<Flyout>
<StackPanel>
. . .
</StackPanel>
</Flyout>
You have two problems here :
1) The property "Content" can only be set once. :
You can't set the content for <Flyout> </Flyout> more than once and you set the content twice (Two TextBlocks) in first XAML code and in the working XAML once(One StackPanel), According to MSDN :
<Flyout>
singleUIElement
</Flyout>
singleUIElement :
A single object element that declares the content. This must be an
object that has UIElement in its hierarchy (plain strings don't work).
This can be a container, such as a Panel derived class, so that
multiple content items within the Flyout can be arranged in layout.
2) The following type was expected: "FlyoutBase".
You can't set Flyout property to any class that not derived from FlyoutBase class (i.e only Flyout and MenuFlyout ). you set the Flyout property in first XAML code to StackPanel and in the working XAML to Flyout .

How to check which instance of child control is used in silverlight

I have two usercontrols : ParentUserControl.xaml and ChildUserControl.xaml
ParentUserControl:
<UserControl x:Class="DemoSilverlight.ParentUserControl"
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:Local="clr-namespace:DemoSilverlight"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400" xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
Loaded="UserControl_Loaded">
<Grid x:Name="LayoutRoot" Background="White">
<sdk:TabControl x:Name="tabControlHeatMapEditor" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SelectionChanged="tabControlHeatMapEditor_SelectionChanged" Height="510" FontFamily="Verdana" FontSize="12">
<sdk:TabItem Header="Original Heat Map" x:Name="tabItemOriginalHeatMap">
<Local:ChildUserControl x:Name="chartControlOriginal"/>
</sdk:TabItem>
<sdk:TabItem Header="Revised Heat Map" x:Name="tabItemRevisedHeatMap">
<Local:ChildUserControl x:Name="chartControlRevised"/>
</sdk:TabItem>
<sdk:TabItem Header="Compare Original/Revised" x:Name="tabItemCompareOrgRev">
<!--<Local:ChildUserControl x:Name="chartControlCompare"/>-->
</sdk:TabItem>
</sdk:TabControl>
</Grid>
</UserControl>
Inside the ChildUserControl control I have a button control. In the code behind page of the
ChildUserControl.xaml.cs, I want to know which instance of the ChildUserControl is used and based on that I want to access the button within the ChildUserControl in order to make it disabled.
Can anyone help me to resolve this problem
Thanks & Regards,
Santosh Kumar Patro
Have a enum in ChildUserControl. Based on TabItem Selection set the enum property and further based on your condition you can either enable or disable the button.