MDL2 Info Symbol - xaml

Microsoft uses a specific symbol for informationial purposes it is a circle with the letter i inside Image of the Symbol. I looked at every resource about the Segoe MDL2 Assets Font but did not find that symbol. Does anyone know if this symbol is part of the font or is it just another image?

The symbol code point is E946.
The following WPF code snippet creates an IEnumerable<int> that contains all symbol code points in Segoe MDL2 Assets.
var typeface = new Typeface(
new FontFamily("Segoe MDL2 Assets"),
FontStyles.Normal, FontWeights.Normal, FontStretches.Normal);
GlyphTypeface glyphTypeface;
typeface.TryGetGlyphTypeface(out glyphTypeface);
var codePoints = glyphTypeface.CharacterToGlyphMap.Keys.Where(c => c > 0x20);
You can easily visualize this collection by setting DataContext = codePoints and writing an ItemsControls like this:
<ItemsControl ItemsSource="{Binding}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock
Margin="2" VerticalAlignment="Center"
Text="{Binding StringFormat={}{0:X4}}"/>
<TextBlock
Margin="2" FontFamily="Segoe MDL2 Assets" FontSize="24"
Text="{Binding Converter={StaticResource CodePointConverter}}"/>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
with this CodePointConverter class:
public class CodePointConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
return new string((char)(int)value, 1);
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotSupportedException();
}
}

Related

Xamarin Forms conditonal formatting based on data with DataTrigger

I am developing a chat application in Xamarin Forms and I am trying to add conditional formatting depending on whether it is an incoming or outgoing message.
This is my XAML:
<Frame
Margin="1"
Padding="0"
x:Name="FrameRef"
x:DataType="model:ChatMessage">
<Frame
CornerRadius="10"
Padding="7"
BackgroundColor="LightBlue"
HasShadow="false"
Margin="10,10,80,0">
<Frame.Triggers>
<DataTrigger
TargetType="Frame"
Binding="{Binding Source={x:Reference FrameRef}, Path=x:DataType.From}" Value="+1456456456">
<Setter Property="BackgroundColor" Value="Yellow"/>
</DataTrigger>
</Frame.Triggers>
When I use Path="Margin" and Value="1" it works.
I am now trying to make it work with the Path being x:DataType="model:ChatMessage" and checking the 'from'-field (indicating if the message was incoming or outgoing).
I'm not sure the Data Trigger is quite right for this application, since you're really depending on a data type and not really the content per se of another field. From the documentation:
The DataTrigger class is suitable for checking values on other controls, as well as any property on the control to which it has been added.
What you probably want instead is a Value Converter that handles locating a StaticResource and applying a style for you based on the message type. Full Microsoft Documentation here.
On your XAML element, you'd do something like this:
<Frame Style="{Binding foo, Converter={StaticResource FooToStyleConverter}}"/>
Your converter would work something like this:
public class FooToStyleConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var someValue = (DataTye)value; // Convert 'object' to whatever type you are expecting
// evaluate the converted value
if (someValue.From != null && someValue.From == Enum.SomeoneElse)
return (Style)App.Current.Resources["StyleReceived"]; // return the desired style indicating the message is from someone else
return (Style)App.Current.Resources["StyleSent"]; // return a style indicating the message is from the sender
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
// Usually unused, but inverse the above logic if needed
throw new NotImplementedException();
}
}
Lastly, set up your converter as a Static Resource in App.xaml (or as a local resource on the page) so your page can properly reference it
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:DataBindingDemos">
<ContentPage.Resources>
<ResourceDictionary>
<local:FooToStyleConverter x:Key="FooToStyleConverter" />
....

Xamarin Forms Alternating BackgroundColor Listview in XAML

For a ListView in Xamarin Forms I'd like to implement an alternating background color for odd and even rows. Right now I have an IValueConverter in place. I'd like to pass the ListViewItem to the convert function.
public class BackgroundConverter : IValueConverter
{
public object Convert (object value, Type targetType, object parameter, CultureInfo culture)
{
if (!(value is int)) return null;
int index = (int)value;
if (index % 2 == 0)
return Color.White;
else
return Color.Blue;
}
....
The Xaml that I currently have in place:
....
<ResourceDictionary>
<local:BackgroundConverter x:Key="bgColorPicker" />
</ResourceDictionary>
....
....
<ListView
x:Name="list"
RowHeight="130"
SeparatorVisibility="None">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid
x:Name="listItem"
Padding="10"
ColumnSpacing="10"
BackgroundColor="{Binding ?, Converter={StaticResource bgColorPicker}}">
How should I implement this further? I tried several Bindings, but I'm not getting any closer. I'd love to get some help on this. It feels like it should be simple to do. But I haven't been able to make it work.
There is a way to do it programatically on both Xaml and Converter.
Pass both ListView and binded object to Converter
Find the indexOf the item on List
Decide the color
Sample Implemtation:
Converter:
using System.Collection;
public class BackgroundConverter : IValueConverter
{
public object Convert (object value, Type targetType, object parameter, CultureInfo culture)
{
int index = 0;
for(var itm in (parameter as ListView).ItemsSource)
if(itm != value)
index++;
else
{
return (index%2==0)?Color.White:Color.Blue;
}
throw new InvalidOperationException("invalid parameters provided");
}
}
Xaml:
< ListView
x:Name="list"
RowHeight="130"
SeparatorVisibility="None">
< ListView.ItemTemplate>
< DataTemplate>
< ViewCell>
< ViewCell.View>
< Grid
x:Name="listItem"
Padding="10"
ColumnSpacing="10"
BackgroundColor="{Binding ., Converter={StaticResource bgColorPicker},ConverterParameter={x:Reference list}}"
>

converter parameter multi binding static resource

Here is my XAML code:
<TextBox HorizontalAlignment="Left" Height="24" Margin="168,352,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="280">
<TextBox.Resources>
<sys:Double x:Key="fixedValue">2</sys:Double>
</TextBox.Resources>
<TextBox.Text>
<MultiBinding Converter="{StaticResource DoubleConverter}">
<Binding Path="RM.SpecificGravity"/>
<Binding Source="{StaticResource fixedValue}"/>
</MultiBinding>
</TextBox.Text>
</TextBox>
This is giving me this error:
Two-way binding requires Path or XPath.
What is causing this and how can I fix it?
As the error message says, you need to set the Path of the Binding. For binding directly to the Source object, you can set Path=".":
<Binding Path="." Source="{StaticResource fixedValue}"/>
That said, your MultiBinding might be replaced by a normal Binding, where the fixedValue is passed as ConverterParameter
<TextBox Text="{Binding Path=RM.SpecificGravity,
Converter={StaticResource DoubleConverter},
ConverterParameter=2}" />
with a value-converter like this:
public class DoubleConverter : IValueConverter
{
public object Convert(
object value, Type targetType, object parameter, CultureInfo culture)
{
var p = double.Parse(parameter.ToString());
...
}
...
}

DataTriggerBehavior Doesn't Work With Enum?

I'm trying to use a DataTriggerBehavior from the Behaviors SDK. But it doesn't seem to work with enums... or else I'm doing something wrong.
You can assume that the DataContext for these examples is something like this (INotifyPropertyChanged is implemented, but I'm not going to show it here):
public class MyDataClass
{
public MyEnum ItemCommand { get; set; }
public string ItemCommandString { get; set; }
}
public enum MyEnum
{
EnumValue1
}
_Button.DataContext = new MyDataClass() { ItemCommand = MyEnum.EnumValue1,
ItemCommandString = "EnumValue1" };
Here is the code that doesn't work (trying to specify an enum value and check against the ItemCommand enum property):
<ToggleButton x:Name="_Button">
<Interactivity:Interaction.Behaviors>
<Core:DataTriggerBehavior Binding="{Binding ItemCommand}"
Value="EnumValue1">
<Core:ChangePropertyAction PropertyName="Command"
TargetObject="{Binding ElementName=_Button}"
Value="{x:Null}">
</Core:ChangePropertyAction>
</Core:DataTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ToggleButton>
and this code (checking against an enum resource) also does not work:
<UserControl.Resources>
<local:MyEnum x:Key="_MyEnumValue">EnumValue1</local:MyEnum>
</UserControl.Resources>
<ToggleButton x:Name="_Button">
<Interactivity:Interaction.Behaviors>
<Core:DataTriggerBehavior Binding="{Binding ItemCommand}"
Value="{StaticResource _MyEnumValue}">
<Core:ChangePropertyAction PropertyName="Command"
TargetObject="{Binding ElementName=_Button}"
Value="{x:Null}">
</Core:ChangePropertyAction>
</Core:DataTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ToggleButton>
whereas this code (checking against a string) does work:
<ToggleButton x:Name="_Button">
<Interactivity:Interaction.Behaviors>
<Core:DataTriggerBehavior Binding="{Binding ItemCommandString}"
Value="EnumValue1">
<Core:ChangePropertyAction PropertyName="Command"
TargetObject="{Binding ElementName=_Button}"
Value="{x:Null}">
</Core:ChangePropertyAction>
</Core:DataTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ToggleButton>
What is the correct way to specify the enum value in the DataTriggerBehavior Value property so that this will work?
you can write a Converter:
public class MyEnumConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, string language)
{
MyEnum myEnumValue = (MyEnum)value;
return myEnumValue.ToString();
}
public object ConvertBack(object value, Type targetType, object parameter, string language)
{
throw new NotImplementedException();
}
}
And use it in XAML:
<ToggleButton x:Name="_Button">
<Interactivity:Interaction.Behaviors>
<Core:DataTriggerBehavior Binding="{Binding ItemCommand, Converter={StaticResource MyEnumConverter}}"
Value="EnumValue1">
<Core:ChangePropertyAction PropertyName="Command"
TargetObject="{Binding ElementName=_Button}"
Value="{x:Null}">
</Core:ChangePropertyAction>
</Core:DataTriggerBehavior>
</Interactivity:Interaction.Behaviors>
</ToggleButton>
Or bind direct to the string as in your sample. Unfortunately DataTriggerBehavior in WinRT is worse that DataTrigger in Windows Phone 8
I was investigating this issue and narrowed the problem down to TypeConverterHelper class.
TypeConverterHelper source
Apparently it doesn’t account for enum types and falls back to some logic which recreates the xaml string for the enum. Parses it as ContentControl and passes back its content. Unfortunately during this step it loses the enum type information and subsequent type casting is not valid.
If you are working with sources and not just NuGet package you can fix it yourself. Just add another overload of Convert method to TypeConverterHelper:
public static Object Convert(string value, Type destinationType)
{
var typeInfo = destinationType.GetTypeInfo();
if (typeInfo.IsEnum)
return Enum.Parse(destinationType, value);
return Convert(value, destinationType.FullName);
}
And of course change the call in DataTriggerBehavior Compare method
from:
rightOperand = TypeConverterHelper.Convert(rightOperand.ToString(), leftOperand.GetType().FullName);
to:
rightOperand = TypeConverterHelper.Convert(rightOperand.ToString(), leftOperand.GetType());

chessboard type grid on windows phone 8

Im trying to make a grid similar to the way a chessboard looks like in windows phone 8 but im new to developing for the windows phone and using xaml and am not sure where to begin i would like to update a change the colors of the "squares", most examples ive seen are in wpf and they use UniformGrid which is unavailable in windows phone.
so what ive found so far is
<Grid Margin="29,29.5,23,32.5" Height="500">
<Rectangle Stroke="Black">
<Rectangle.Fill>
<SolidColorBrush Color="{DynamicResource color}"/>
</Rectangle.Fill>
</Rectangle>
.
.
.
</grid>
but is their a way to generate a grid of varing size such as 12x12 or 9x8 if i used the code above then i need to make a rectangle for every square which isnt what im going for.
So im just wondering what the xaml would look like it also seems that i need to use data bindings to update the UI. Is their any way to generate a visual grid and be able to update the contents inside. If anyone would could point me in the right direction that would really helpful.
Create a two-level view model of rows and cells. Bind the rows to an ItemsControl, then in the item template, bind the cells to another ItemsControl. Each cell will have a property to tell if it is even or odd, so you can achieve the checkerboard pattern. You can expose game state through additional properties of the cell to display board position through data binding.
Finally, since the cells will have a fixed size, wrap the whole thing in a Viewbox to fit it to your container.
The view models:
public class BoardViewModel
{
private readonly int _rows;
private readonly int _columns;
public BoardViewModel(int rows, int columns)
{
_rows = rows;
_columns = columns;
}
public IEnumerable<RowViewModel> Rows
{
get
{
return Enumerable
.Range(0, _rows)
.Select(row => new RowViewModel(row, _columns))
.ToList();
}
}
}
public class RowViewModel
{
private readonly int _row;
private readonly int _columns;
public RowViewModel(int row, int columns)
{
_row = row;
_columns = columns;
}
public IEnumerable<CellViewModel> Cells
{
get
{
return Enumerable
.Range(0, _columns)
.Select(column => new CellViewModel(_row, column))
.ToList();
}
}
}
public class CellViewModel
{
private readonly int _row;
private readonly int _column;
public CellViewModel(int row, int column)
{
_row = row;
_column = column;
}
public bool IsEven
{
get { return (_row + _column) % 2 == 0; }
}
}
The value converter:
public class CellColorValueConverter : IValueConverter
{
public object Convert(
object value,
Type targetType,
object parameter,
CultureInfo culture)
{
return Application.Current.Resources[
(bool)value == true
? "EvenCellColor"
: "OddCellColor"];
}
public object ConvertBack(
object value,
Type targetType,
object parameter,
CultureInfo culture)
{
throw new NotImplementedException();
}
}
The XAML:
<Window.Resources>
<local:CellColorValueConverter
x:Key="CellColor" />
</Window.Resources>
<Grid>
<Viewbox>
<ItemsControl
ItemsSource="{Binding Rows}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<ItemsControl
ItemsSource="{Binding Cells}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel
Orientation="Horizontal" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Rectangle
Width="50"
Height="50"
Fill="{Binding IsEven, Converter={StaticResource CellColor}}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Viewbox>
</Grid>