I have a Frame with a StackLayout inside of it:
<Frame CornerRadius="1" HasShadow="false" Margin="10"
BackgroundColor="White" BorderColor="Silver" Padding="0" >
<StackLayout Orientation="Vertical" Spacing="0" Padding="0" >
<xaml:PtiXaml />
<template:LineTemplate />
<xaml:AtiXaml />
<template:LineTemplate />
<xaml:StiXaml />
</StackLayout>
</Frame>
Can I create a new object called NewFrame that is the same as the Frame with the StackLayout inside?
<template:NewFrame>
<xaml:PtiXaml />
<template:LineTemplate />
<xaml:AtiXaml />
<template:LineTemplate />
<xaml:StiXaml />
</template:NewFrame>
or
<template:NewFrame>
<xaml:ABCXaml />
</template:NewFrame>
or
<template:NewFrame>
<Label Text="X" />
</template:NewFrame>
It was suggested I use a Custom View but I have looked and can not find an example of this where it contains other elements inside.
Right-Click at the desired position in your Shared Project (or PCL) in your Solution Explorer (I would recommend adding a folder named "Views" or "CustomViews" and creating the item inside that folder), select "Add new item" and choose "Content View" (without (C#) behind it. The filename should be something like "View1.xaml", you can change that due to your liking, however the important thing is that the xaml extension is there.
This will create a new ContentView with a xaml and xaml.cs file. Inside the xaml file you can declare your xaml code posted above and write any code necessary into the xaml.cs file.
Now you can add a namespace declaration to the page you want to put your view into:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
...
xmlns:customs="clr-namespace:YourNamespace.Views;assembly=YourNamespace"
and declare the element in that Page's or any layout's content:
<customs:CustomViewName ... />
If you want to be able to control the element's behaviour you can add BindableProperties in the codebehind.
For more in-depth information on that, you might want to take a look into this article: https://visualstudiomagazine.com/articles/2017/10/01/add-custom-controls.aspx
Use a ContentView
along with a ControlTemplate
to create a Custom Control. This way you can create a new control called NewFrame
, write the XAML for your control and then use the <ContentPresenter>
tag inside your <ControlTemplate>
to assign where you'd like your content to be.
Like so:
.
└── NewFrame
├── NewFrame.cs
└── NewFrame.xaml -> Is a ResourceDictionary
NewFrame.cs:
namespace TestApp.Controls
{
public partial class NewFrame : ContentView
{
}
}
NewFrame.xaml:
<ResourceDictionary
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:newFrame="clr-namespace:TestApp.Controls"
x:Class="Namespace.For.A.ResourceDictionary">
<Style TargetType="newFrame:NewFrame">
<Setter Property="ControlTemplate">
<Setter.Value>
<ControlTemplate>
<ContentView BackgroundColor="Transparent">
<Frame CornerRadius="1" HasShadow="false" Margin="10" BackgroundColor="White" BorderColor="Silver" Padding="0" >
<StackLayout Orientation="Vertical" Spacing="0" Padding="0">
<ContentPresenter/>
</StackLayout>
</Frame>
</ContentView>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
ConsumingYourControl.xaml:
<template:NewFrame>
<template:NewFrame.Content>
<xaml:PtiXaml />
<template:LineTemplate />
<xaml:AtiXaml />
<template:LineTemplate />
<xaml:StiXaml />
</template:NewFrame.Content>
</template:NewFrame>
<template:NewFrame>
<template:NewFrame.Content>
<xaml:ABCXaml />
</template:NewFrame.Content>
</template:NewFrame>
<template:NewFrame>
<template:NewFrame.Content>
<Label Text=""/>
</template:NewFrame.Content>
</template:NewFrame>
ContentProperty
attribute? - Tom