List<Color> in Xaml - xaml

I have my List defined in Xaml like this.
<ContentPage.Resources>
<ResourceDictionary>
<local:FileName x:Key="fileName">
<Color>#3599B8</Color>
<Color>#374649</Color>
<Color>#FD625E</Color>
<Color>#F2C80F</Color>
</local:FileName>
</ResourceDictionary>
</ContentPage.Resources>
FileName is defined in code behind like this.
public class FileName : List<Color>
{
}
Instead of directly setting the Color values, i want to define it as resource like this
<Color x:Key="BasicColorSchemeBlue">#3599B8</Color>
and use it.
Any suggestions on how to do this.
Thanks in advance.

GradientColors is an array of Colors.
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:GradientTest"
xmlns:s="clr-namespace:System;assembly=mscorlib"
x:Class="GradientTest.GradientTestPage">
<StackLayout Padding="20, 40, 20, 20">
<local:GradientViewRender HorizontalOptions="Center"
WidthRequest="300"
HeightRequest="50"
x:Name="gradientView">
<local:GradientViewRender.GradientColors>
<x:Array Type="{x:Type Color}">
<Color>#5FC900</Color>
<Color>#0FF2C8</Color>
</x:Array>
</local:GradientViewRender.GradientColors>
</local:GradientViewRender>
</StackLayout>
</ContentPage>

I have done like this on a working App.
This goes inside App.xaml:
<Color x:Key="COLOR_NAME">#ffffff</Color>
to access the color from a .cs file, use:
(Color)ResourceFinder.FindResource("COLOR_NAME");
Or use StaticResource or DynamicResource within an xaml file.

Related

How can I display a ContentView in a ContentPage

I created a sftabView, every SfTabItem have a ContentView so I created an other View to display it in this ContentView. so the question is how to make this happened?
This is the ContentView which I wanted to display in the ContentPage
<?xml version="1.0" encoding="utf-8" ?>
<ContentView
xmlns="http://xamarin.com/schemas/2014/forms"
x:Class="App5.Views.Self_Trainig"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
NavigationPage.HasNavigationBar="False">
<ContentView.Resources>
<ResourceDictionary>
............
</ResourceDictionary>
</ContentView.Resources>
<ContentView.Content>
<AbsoluteLayout>
...............
</AbsoluteLayout>
</ContentView.Content>
</ContentView>
and this is my ContentPage:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:tabView="clr-namespace:Syncfusion.XForms.TabView;assembly=Syncfusion.SfTabView.XForms"
x:Class="App5.Views.Accueil">
<ContentPage.Content>
<tabView:SfTabView OverflowMode="DropDown" VisibleHeaderCount="3" BackgroundColor="White">
<tabView:SfTabItem Title="Self Training">
<tabView:SfTabItem.Content>
""the code to display it here""
</tabView:SfTabItem.Content>
</tabView:SfTabItem>
<tabView:SfTabItem Title="Contacts">
<tabView:SfTabItem.Content>
<Grid BackgroundColor="White" x:Name="ContactsGrid" />
</tabView:SfTabItem.Content>
</tabView:SfTabItem>
</tabView:SfTabView>
</ContentPage.Content>
</ContentPage>
<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:mynamespace=clr-namespace:App5.Views"
...>
...
<tabView:SfTabItem.Content>
<mynamespace:Self_Trainig ... />
</tabView:SfTabItem.Content>
Explanation:
Add an xmlns:... definition for the namespace your ContentView is in.
Add an element with that namespace and the class name of your ContentView. <mynamespace:Self_Trainig ... />
...: After the class name, you can add any needed attributes. Just like any other ContentView.
If you want your view to have "custom" attributes (as opposed to the standard attributes of ContentView such as BackgroundColor), that can be set in each page's XAML, then in your ContentView's code behind, you'll add BindablePropertys. Doing that correctly is beyond the scope of this answer; there are other Q&As on that topic.
is it possible to display the view form the C# code ?
i mean doing
ContentView x:Name="TheView"
and on the C# code doing something like
TheView = Self_Trainig;
i know that code doesn't work but i'm searching that kind of solution

Xamarin Forms The type TouchEffect was not found

I want to use this xaml code:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
xmlns:tt="clr-namespace:TouchTracking;assembly=TouchTracking"
mc:Ignorable="d"
x:Class="MyApp.MemeBuilder"
BackgroundColor="#212121">
<ContentPage.Content>
<Grid BackgroundColor="White">
<skia:SKCanvasView x:Name="MyCanvas"
PaintSurface="OnCanvasViewPaintSurface" />
<Grid.Effects>
<tt:TouchEffect Capture="True"
TouchAction="OnTouchEffectAction" />
</Grid.Effects>
</Grid>
</ContentPage.Content>
</ContentPage>
I installed skiasharp and the nuget-package TouchTracking, but I still get the error:
The type tt:TouchEffect was not found
How can I fix this?
Looks like you are using Touch Tracking library in Forms. Your assembly reference is incorrect. Below one should work:
xmlns:tt="clr-namespace:TouchTracking.Forms;assembly=TouchTracking.Forms"
Also, make sure you install the "TouchTracking.Forms" nuget package instead "TouchTracking".
More info here : https://github.com/OndrejKunc/SkiaScene#touchtrackingforms

Use resource file in XAML file (Xamarin)

How to use resource files in XAML (xamarin forms) like <Label Text="MyApp.resouces.MyString" />?
There is a nice article here covering this topic. It includes lot of examples.
After you implement your TranslateExtension your code will look like this:
<Label x:Name="lblName" Text="{local:TranslateExtension MyString}" />
Your App.axml file:
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Master.App">
<Application.Resources>
<!-- Application resource dictionary -->
<ResourceDictionary>
<x:String x:Key="AppName">Name of app</x:String>
</ResourceDictionary>
</Application.Resources>
</Application>
And then your label:
<Label Text="{StaticResource AppName}"/>

Property Content is null or is not IEnumerable

I have a test page in Xamarin.Forms and it gets me this error, how can I fix this ?
Property Content is null or is not IEnumerable
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="Project1.Page1">
<ContentPage.Content>
<Label Text="Page"></Label>
<Editor Text="I am an Editor" />
</ContentPage.Content>
</ContentPage>
The Content property is of type View. You cannot have two views into it. Replace it with
<StackLayout >
<Label Text="Page"></Label>
<Editor Text="I am an Editor" />
<StackLayout>
If anyone else lands here from google and the above wasn't the fix. For me it was because I had a view with a Grid.Row="0" property set even though I accidentally placed it outside the bounds of the actual grid.

Circular referenced IValueConverter in Application.Resources

I'm getting the error :
StaticResource not found for key maxLength
the setup is as follows:
Converter setup in app.xaml, which also contains a datatemplate
<Application.Resources>
<ResourceDictionary>
<ext:MaxLengthStringConverter x:Key="maxLength"/>
....
<DataTemplate x:Key="HotelViewModel">
<tripSegmentPartViews:HotelView
Padding="0"
HeightRequest="60"
BorderWidth="1"
BorderColor="{ext:ColourResource Divider}"
BordersToDraw="{x:Static controls:Borders.Top}"
BackgroundColor="Transparent"/>
</DataTemplate>
....
view in the HotelView.xaml which is in the datatemplate, uses the converter
....
<Label Text="{Binding HotelName, Converter={StaticResource maxLength}, ConverterParameter=10}"
AbsoluteLayout.LayoutFlags="All"
AbsoluteLayout.LayoutBounds="1,0.2,0.62,0.5"
VerticalOptions="End"
HorizontalOptions="Start"
FontSize="20"
/>
....
If I move the converter to HotelView.xaml resource dictionary it works
If I change the reference to a DynamicResource it is not used
Obviously with something as basic as max length (which shortens the string and adds '...' if its over the required length) I want to be able to use it through out the application, and not have to reference it in multiple resource dictionaries.
Is this a bug?
----------------- edit ------------------
OK I have reproduced this errror with a minimum app consisting of:
App1.xaml
<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App1.App"
xmlns:ext="clr-namespace:App1.Extensions;assembly=App1"
xmlns:local="clr-namespace:App1;assembly=App1">
<Application.Resources>
<ResourceDictionary>
<ext:MyConverter x:Key="conv"></ext:MyConverter>
<DataTemplate x:Key="dt">
<local:View1></local:View1>
</DataTemplate>
</ResourceDictionary>
</Application.Resources>
</Application>
Page1.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="App1.Page1"
xmlns:local="clr-namespace:App1;assembly=App1">
<StackLayout>
<Label Text="Page1" VerticalOptions="Center" HorizontalOptions="Center" TextColor="White" />
<ListView ItemTemplate="{StaticResource dt}" ItemsSource="List">
</ListView>
</StackLayout>
</ContentPage>
View1.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App1.View1"
xmlns:ext="App1.Extensions">
<Label Text="{Binding MainText, Converter={StaticResource conv}" VerticalOptions="Center" HorizontalOptions="Center" TextColor="White"/>
</ContentView>
App1.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Xamarin.Forms;
namespace App1
{
public partial class App : Application
{
public App()
{
InitializeComponent();
// The root page of your application
Page1 p = new Page1();
p.BindingContext = new {
MainText = "test",
List = new List<string>() { "test"}
};
var navContainer = new NavigationPage(p);
navContainer.BarBackgroundColor = Color.Red;
navContainer.BarTextColor = Color.White;
MainPage = navContainer;
}
}
}
The error is thrown at runtime using the VS emulator
From what you mention you want to be able to define a IValueConverter the once, and use it from any Xamarin.Forms ContentPage, without the need to keep specifying the converter in the local XAML page.
This can be achieved by doing the following:-
In your PCL you normally have App.cs.
You will need to delete this, and add a new Forms Xaml Page called App.cs.
This will generate both the App.xaml and related App.cs files.
In this question, (How can I databind an image?), there is a converter called MyByteToImageSourceConverter.
I will illustrate using this:-
App.xaml
<?xml version="1.0" encoding="utf-8" ?>
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="SampleApp.App"
xmlns:local="clr-namespace:{namespace reference goes here to the converter}"
>
<Application.Resources>
<ResourceDictionary>
<local:MyByteToImageSourceConverter x:Key="kyByteToImageSourceConverter"/>
</ResourceDictionary>
</Application.Resources>
</Application>
So in the above we have defined our converter with a key, that we will then be able to reference from all other Xamarin.Forms ContentPage's.
App.cs
namespace SampleApp
{
public partial class App
: Xamarin.Forms.Application
{
public App()
{
InitializeComponent();
//
this.MainPage = new ByteToImageExample2();
}
}
}
In the code-behind we need to change the default inheritance from ContentPage and specify Xamarin.Forms.Application.
We also specify our launch page, via the this.MainPage = ...
ByteToImageExample2.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="SampleApp.ByteToImageExample2"
>
<StackLayout>
<Image Source="{Binding MyImageAsBytes, Converter={StaticResource kyByteToImageSourceConverter}}"/>
</StackLayout>
</ContentPage>
In our ContentPage we can see above we are referencing the converter that we specified in App.xaml via the StaticResource kyByteToImageSourceConverter.
As that was definied in App.xaml, we can re-use this in all our pages without the need to specify the location of the converter locally.
For completeness the code-behind is:-
ByteToImageExample2.cs:-
public partial class ByteToImageExample2 : ContentPage
{
public ByteToImageExample2()
{
InitializeComponent();
//
byte[] bytImage = { your image as a byte collection }
//
this.BindingContext = new MyImageViewModel()
{
MyImageAsBytes = bytImage
};
}
}
Update 1:-
You can have the following in your App.xaml:-
<DataTemplate x:Key="kyByteToImage3ExampleDataTemplate2">
<ViewCell>
<local2:MyCustomView1/>
</ViewCell>
</DataTemplate>
with local2:MyCustomView1 referencing your custom view, which for this example is defined as:-
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="SampleApp.MyCustomView1">
<Image Source="{Binding MyImage, Converter={StaticResource kyByteToImageSourceConverter}}" Aspect="AspectFit" />
</ContentView>
This custom view still uses a Converter as specified from the App.xaml and does still render, without the need to specify the Converter locally within the ContentView class.