Xamarin.Forms XAML Image as root element - image

I am new to XAML and everywhere I read about it one would usually use some sort of container as the root view (StackLayout, ContentPage, ContentView, RelativeLayout etc).
But, I run into this XAML that uses Image as its root. Why would we do that?
<?xml version="1.0" encoding="utf-8" ?>
<Image
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:r="clr-namespace:My.Resources;assembly=My.Resources"
x:Class="My.Views.Buttons.MyView"
Source="MyImage.png"/>
I would like to replace this Image with FFImageLoading.CachedImage but for that I need to add FFImageLoading xmlns namespace but I cannot since namespaces are inside the Image tag, not outside.

You can specify the namespace in root tag and use it in root tag itself in XAML.
For e.g.:
<ffimageloading:CachedImage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="SomeAppNameSpace.CustomCachedImage"
Source="http://loremflickr.com/600/600/nature?filename=simple.jpg">
</ffimageloading:CachedImage>
Just make sure you derive from the right class in code behind:
namespace SomeAppNameSpace
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class CustomCachedImage : CachedImage
{
public CustomCachedImage()
{
InitializeComponent();
}
}
}

Related

Why I can't find a ResourceDictionary template in my visual studio?

I am a beginner in Xamarin. Now I want to add a ResourceDictionary for making a Theme.
In https://learn.microsoft.com/en-us/dotnet/api/xamarin.forms.resourcedictionary?view=xamarin-forms:
The Namespace of ResourceDictionary is Xamarin.Forms.
Whereas, there is not any ResourceDictionary template.
I tried to search it again:
There is nothing about this. I am using the Visual Studio Community 2019 Version 16.5.4. Why it turns out to be this and how can I solve it?
Thank you.
I think that you are mixing the terms here. Namespaces and assemblies are totally different things than the New item templates inside Visual studio. ResourceDictionary class is inside the Xamarin.Forms, indeed, and in the same time inside the Xamarin.Forms.Core.dll. This doesn't mean that it should be inside the new item template. There are a lot of other classes inside this namespace.
Having said that, you can create ResourceDictionary class in 2 ways:
If you want to write in it entirely in c#, what you will need is a .cs file. The file can be either ContentPage (C#) from the templates above (the second item from your screenshot), or a simple .cs calss file will do the work also. After that, inherit from ResourceDictionary class like so:
public class MyResourceDictionary : Xamarin.Forms.ResourceDictionary
{
}
If you want to write in it in xaml, then simply create a new ContentPage (the first item from your screenshot). Any other type of the combo .xaml together with a .xaml.cs code-behind file will work too. After the files have been created, change their structure from:
MyResoruceDictionary.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="LEUA.Services.MyResourceDictionary">
<ContentPage.Content>
<StackLayout>
<Label Text="Hello, world!"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
MyResourceDictionary.xaml.cs
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MyResourceDictionary : ContentPage
{
public MyResourceDictionary()
{
InitializeComponent();
}
}
to this
MyResoruceDictionary.xaml
<?xml version="1.0" encoding="utf-8"?>
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="LEUA.Services.MyResourceDictionary">
</ResourceDictionary>
MyResourceDictionary.xaml.cs
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class MyResourceDictionary : Xamarin.Forms.ResourceDictionary
{
public MyResourceDictionary()
{
InitializeComponent();
}
}

How can I change the color of a Label in a template in the C# back end?

I have this template that's simplified for the question:
<?xml version="1.0" encoding="UTF-8"?>
<Frame xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:t="clr-namespace:Japanese.Templates"
xmlns:local="clr-namespace:Japanese;assembly=Japanese"
x:Class="Japanese.Templates.RoundButtonText" x:Name="this">
<Label Text="ABC" />
</Frame>
and this C#
using Xamarin.Forms;
namespace Japanese.Templates
{
public partial class RoundButtonText : BaseFrameButtonTemplate
{
public RoundButtonText()
{
InitializeComponent();
?? = Color.Red;
}
}
}
Can someone help me by telling me how I can change the TextColor of the label in the XAML inside the constructor of the back-end C#. Note that there's much more to this but I'm simplifying what I need for the question as if I know this then I can do the rest.
Specify x:Name="MyLabel" on the Label you want to access.
Then you can access that Label in your back-end C# file like so:
public RoundButtonText()
{
InitializeComponent();
MyLabel.TextColor = Color.Red; //OR
MyLabel.BackgroundColor = Color.Red;
}
That allows you to be able access any public property on the Label

Can I "include" a XAML file? [duplicate]

I am trying a new approach i.e. XAML to make application in xamarin.forms. At this time i am facing an issue to reuse my stack layout which is having a image and label. How i can reuse my layout in different pages using XAML.
You can actually define your custom component in a separate XAML file and then just link the component wherever you need it.
For example a label with image can be grouped together in a dedicated XAML file:
<?xml version="1.0" encoding="utf-8" ?>
<StackLayout xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="UserControls.ImageWithTitle"
VerticalOptions="Center" HorizontalOptions="Center" >
<Label HorizontalOptions="Center"
x:Name="TitleLabel" />
<Image Source="noimage.png" />
</StackLayout>
On the .cs file I've defined a binding for the TitleLabel
public string TitleName
{
get { return TitleLabel.Text; }
set { TitleLabel.Text = value; }
}
So when you include the component on another layout, you can assign the label value directly (or via a binding):
<usercontrols:ImageWithTitle TitleName="Home"/>

Xamarin Forms: Custom View (Single Implementation)

I've been searching high and low to find an example of how to write a custom UI element that has one implementation (single renderer).
For example, is there a way to simply implement a class that inherits from StackLayout (written in C#) and can then be slotted into other layouts (xaml) as a UI element (similar to how its done using xml views in Android)?
The following is what I have right now, but I am getting errors:
ButtonCustom.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
namespace DWalker
{
public partial class ButtonCustom : StackLayout
{
public ButtonCustom()
{
InitializeComponent();
}
public Color TextColor
{
get { return this.Text.TextColor; }
set { this.Text.TextColor = value; }
}
public Label TextControl
{
get { return this.Text; }
set { this.Text = value; }
}
}
}
ButtonCustom.xaml
<?xml version="1.0" encoding="UTF-8"?>
<StackLayout
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:common="clr-namespace:Dwalker;assembly=DWalker"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DWalker.ButtonCustom">
<Image
x:Name="Icon"
Source="Icon.png" />
<Label
x:Name="Text"
Text="Hello"
HorizontalOptions="Center"
LineBreakMode="NoWrap"
Font="Small"
TextColor="Black"/>
</StackLayout>
Then I'd like to add my custom element to a xaml layouts ContentPage like so:
ViewStart.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"
xmlns:common="clr-namespace:DWalker;assembly=DWalker"
xmlns:controls="clr-namespace:DWalker;assembly=DWalker"
x:Class="DWalker.ViewStart"
Title="DWalker" >
<AbsoluteLayout>
<controls:ButtonCustom />
</AbsoluteLayout>
</ContentPage>

Xamarin Forms Signature Pad

Can someone please guide me on how to use a signature pad on xamarin FORMS.
I have tried resources available online, but the dont work in my project.
<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:acr="clr-namespace:Acr.XamForms.SignaturePad;assembly=Acr.XamForms.SignaturePad" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="Checkin.Signature">
<ContentPage.Content>
<ScrollView>
<StackLayout>
<acr:SignaturePadView
x:Name="padView"
HeightRequest="320"
WidthRequest="240"
BackgroundColor="White"
CaptionText="Caption This"
CaptionTextColor="Black"
ClearText="Clear Me!"
ClearTextColor="Red"
PromptText="Prompt Here"
PromptTextColor="Red"
SignatureLineColor="Aqua"
StrokeColor="Black"
StrokeWidth="2"
/>
</StackLayout>
</ScrollView>
</ContentPage.Content>
Above is one of the codes I have used. A signature pad appears but doesent display anything when I draw on top of it.
This is how the Red Signature pad appears
try to install it on droid project too. that works for me
In the AppDelegate, paste the following code:
public static Type dummyt = typeof(SignaturePad.Forms.iOS.SignaturePadRenderer);
As shown below:
public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate
{
public static Type dummyt = typeof(SignaturePad.Forms.iOS.SignaturePadRenderer);
public override bool FinishedLaunching(UIApplication app, NSDictionary options)
{
The problem apparently is that some DLLs are not

Resources