I tried to achieve an Editor that don't wrapping text with no succeed
I want that newline be by pressing enter and not by wrapping text
How I can get that.?
I tried this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MauiApp1.MainPage">
<ScrollView>
<VerticalStackLayout
Spacing="25"
Margin="5"
VerticalOptions="Center" >
<Border Stroke= "Black" StrokeThickness="2" Background="Pink" >
<Editor HeightRequest="300" WidthRequest="380" BackgroundColor="Aqua" />
</Border>
<Image
Source="dotnet_bot.png"
SemanticProperties.Description="Cute dot net bot waving hi to you!"
HeightRequest="200"
HorizontalOptions="Center" />
<Label
Text="Hello, World!"
SemanticProperties.HeadingLevel="Level1"
FontSize="32"
HorizontalOptions="Center" />
<Label
Text="Welcome to .NET Multi-platform App UI"
SemanticProperties.HeadingLevel="Level2"
SemanticProperties.Description="Welcome to dot net Multi platform App U I"
FontSize="18"
HorizontalOptions="Center" />
<Button
x:Name="CounterBtn"
Text="Click me"
SemanticProperties.Hint="Counts the number of times you click"
Clicked="OnCounterClicked"
HorizontalOptions="Center" />
</VerticalStackLayout>
</ScrollView>
</ContentPage>
Thank you very much
You could use a nested ScrollView.
Xaml:
<ScrollView>
<VerticalStackLayout
Spacing="25"
Margin="5"
VerticalOptions="Center" >
<Border Stroke= "Black" StrokeThickness="2" Background="Pink" >
<ScrollView Orientation="Both" HeightRequest="300" WidthRequest="380" >
<Editor BackgroundColor="Aqua" TextChanged="Editor_TextChanged" />
</ScrollView>
</Border>
.............
</VerticalStackLayout>
</ScrollView>
Related
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:vm="clr-namespace:App1.ViewModel"
x:Class="App1.View.LoginPage" BackgroundColor="#f0f2f5">
<ContentPage.BindingContext>
<vm:LoginViewModel/>
</ContentPage.BindingContext>
<ContentPage.Content>
<StackLayout>
<Image Source="XamarinLogo.png" ></Image>
<Frame BackgroundColor="White" CornerRadius="20" WidthRequest="396" HeightRequest="430" VerticalOptions="Center" HorizontalOptions="Center" >
<StackLayout>
<Label Text="Вход на Lockdown" TextColor="Black" HorizontalOptions="Center" FontSize="Title" Margin="0,30,0,10" />
<Entry Placeholder="Логин" x:Name="login" Text="{Binding Login}" />
<Entry Placeholder="Пароль" x:Name ="password" Text="{Binding Password}" IsPassword="True"/>
<Label x:Name="LoginMessageLabel" Text="{Binding LoginMessage,Mode=OneWay}" IsVisible="{Binding TurnLoginMessage,Mode=OneWay}" Margin="10,0,0,0" TextColor="Red"></Label>
<Button x:Name="loginButton" Text="Вход" TextColor="White" BorderRadius="6" BackgroundColor="#1877F2" Margin="10,10,10,10"
Command="{Binding cmdLogin}">
</Button>
<Button x:Name="createAccount" Text="Создать новый аккаунт" TextColor="White" BorderRadius="6" BackgroundColor="#42B72A" Margin="10,10,10,10" Command="{Binding cmdCreateAccount}"/>
<Label Text="Забыли пароль?" TextColor="#1877F2" HorizontalOptions="Center">
<Label.GestureRecognizers>
<TapGestureRecognizer Command="{Binding cmdForgotPassword}"/>
</Label.GestureRecognizers>
</Label>
</StackLayout>
</Frame>
</StackLayout></ContentPage.Content>
what is the problem?This is my first time working with xamarin, I don't understand what the error is.What is not closed if I closed it?
you need to close every control you create. you forget to close ContentPage
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:vm="clr-namespace:App1.ViewModel"
x:Class="App1.View.LoginPage" BackgroundColor="#f0f2f5">
<ContentPage.BindingContext>
<vm:LoginViewModel/>
</ContentPage.BindingContext>
<ContentPage.Content>
<StackLayout>
<Image Source="XamarinLogo.png" ></Image>
<Frame BackgroundColor="White" CornerRadius="20" WidthRequest="396" HeightRequest="430" VerticalOptions="Center" HorizontalOptions="Center" >
<StackLayout>
<Label Text="Вход на Lockdown" TextColor="Black" HorizontalOptions="Center" FontSize="Title" Margin="0,30,0,10" />
<Entry Placeholder="Логин" x:Name="login" Text="{Binding Login}" />
<Entry Placeholder="Пароль" x:Name ="password" Text="{Binding Password}" IsPassword="True"/>
<Label x:Name="LoginMessageLabel" Text="{Binding LoginMessage,Mode=OneWay}" IsVisible="{Binding TurnLoginMessage,Mode=OneWay}" Margin="10,0,0,0" TextColor="Red"></Label>
<Button x:Name="loginButton" Text="Вход" TextColor="White" BorderRadius="6" BackgroundColor="#1877F2" Margin="10,10,10,10"
Command="{Binding cmdLogin}">
</Button>
<Button x:Name="createAccount" Text="Создать новый аккаунт" TextColor="White" BorderRadius="6" BackgroundColor="#42B72A" Margin="10,10,10,10" Command="{Binding cmdCreateAccount}"/>
<Label Text="Забыли пароль?" TextColor="#1877F2" HorizontalOptions="Center">
<Label.GestureRecognizers>
<TapGestureRecognizer Command="{Binding cmdForgotPassword}"/>
</Label.GestureRecognizers>
</Label>
</StackLayout>
</Frame>
</StackLayout></ContentPage.Content>
</ContentPage>
<StackLayout Grid.Row="1" Grid.Column="0" BackgroundColor="#57bcec" Padding="5" Orientation="Horizontal">
<ContentView Padding="5,0,0,0">
<ffimageloading:CachedImage DownsampleToViewSize="True" HorizontalOptions="Center" VerticalOptions="Center"
ErrorPlaceholder="{Binding PlaceholderImage}" LoadingPlaceholder="{Binding PlaceholderImage}"
Source="{Binding UserImage, Converter={Helper:ImageSourceConverter}}"
Aspect="AspectFit">
<ffimageloading:CachedImage.WidthRequest>
<OnPlatform x:TypeArguments="x:Double" iOS="40" Android="40" WinPhone="40" />
</ffimageloading:CachedImage.WidthRequest>
<ffimageloading:CachedImage.HeightRequest>
<OnPlatform x:TypeArguments="x:Double" iOS="40" Android="40" WinPhone="40" />
</ffimageloading:CachedImage.HeightRequest>
<ffimageloading:CachedImage.Transformations>
<fftransformations:CircleTransformation BorderSize="3" BorderHexColor="#34C04E"/>
</ffimageloading:CachedImage.Transformations>
</ffimageloading:CachedImage>
</ContentView>
<ContentView Padding="10,0,0,0" VerticalOptions="FillAndExpand">
<Label Text="Alan Parker" FontSize="14" FontFamily="{StaticResource Lato_Regular}" TextColor="White" VerticalOptions="Center" />
</ContentView>
</StackLayout>
Image URL: https://images.app.goo.gl/ZLSN5x9VNeebTD6z8
Output: Notice that image get cut-off from the corners
Normal Image:
I found one way to do this.
I have used: https://github.com/daniel-luberda/DLToolkit.Forms.Controls/tree/master/ImageCropView
<imgcrop:ImageCropView HeightRequest="50" WidthRequest="50" x:Name="cropView"
Source="https://anothercommonman.files.wordpress.com/2011/10/gandhiji.jpg">
<imgcrop:ImageCropView.PreviewTransformations>
<ffTransformations:CircleTransformation />
</imgcrop:ImageCropView.PreviewTransformations>
</imgcrop:ImageCropView>
I'm using xamarin cross-platform.
I want to add same the "floating menu item" in the every .xaml page.(home/logout/view/ account)
I have added below master page.
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ABCAPP.Views.MasterDetailPage1"
xmlns:pages="clr-namespace:ABCAPP.Views">
<MasterDetailPage.Master>
<pages:MasterDetailPage1Master x:Name="MasterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<pages:MasterDetailPage1Detail>
<StackLayout>
<StackLayout Orientation="Horizontal" VerticalOptions="Start">
<!--top controls-->
</StackLayout>
<StackLayout VerticalOptions="CenterAndExpand">
<!--middle controls-->
</StackLayout>
<StackLayout Orientation="Horizontal" VerticalOptions="End">
<Button Text="A" FontAttributes="Bold" BackgroundColor="MediumSlateBlue" BorderRadius="50" TextColor="White"></Button>
<Button Text="B" FontAttributes="Bold" BackgroundColor="MediumSlateBlue" TextColor="White"></Button>
<!--bottom controls-->
</StackLayout>
</StackLayout>
</pages:MasterDetailPage1Detail>
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
How do I add this layout to my other .xaml Content Pages ?
This is my Content Pages
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="ABCAPP.Views.Confirmed">
<ContentPage.Content>
<ScrollView>
<StackLayout Spacing="20" Padding="15" BackgroundColor="Orange">
<Label Text="Thank you!" FontSize="50" FontAttributes="Bold" TextColor="White" HorizontalOptions="Center" />
<Label Text=" confirmed." FontSize="30" FontAttributes="Bold" TextColor="White" HorizontalOptions="Center" />
<Label x:Name="lblMsg" TextColor="Red" IsVisible="False" ></Label>
<Button Text="ADD " Clicked="NewAttend_Clicked" FontAttributes="Bold" BackgroundColor="MediumSlateBlue" BorderRadius="5" TextColor="White"></Button>
<Button Text="RETURN " Clicked="List_Clicked" FontAttributes="Bold" BackgroundColor="MediumSlateBlue" BorderRadius="5" TextColor="White"></Button>
<Image Source="drawable/icon" ></Image>
</StackLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
I'm trying to get my floating action button in the bottom left corner of my application.
Currently it looks like this:
And I want it to look like this:
My 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:local="clr-namespace:xxx;assembly=xxx"
x:Class="xxx.xxx.xxx.xxxx">
<AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="0,0,1,1">
<StackLayout Orientation="Vertical" VerticalOptions="StartAndExpand">
<StackLayout HorizontalOptions="CenterAndExpand" Margin="0,15,0,0" Orientation="Vertical">
<!--<local:CustomImage Source="logo.png" HeightRequest="100" WidthRequest="100" HorizontalOptions="Center" />-->
<local:CustomImageButton WidthRequest="150" Image="Foto.png" ClassId="Eigendommen" x:Name="buttonFoto" HeightRequest="150"/>
</StackLayout>
<StackLayout Orientation="Vertical" VerticalOptions="CenterAndExpand" Margin="10,0,0,0" x:Name="MainStack" >
<BoxView BackgroundColor="#F15A35" HeightRequest="1" WidthRequest="400" Margin="0,-2,0,5" />
<Label Text="Toegevoegd:" FontSize="Medium" FontAttributes="Bold" />
<StackLayout Orientation="Horizontal">
<StackLayout Orientation="Vertical" IsVisible="False" Margin="10,0,10,0" x:Name="hideImage1">
<local:CustomImage HeightRequest="100" WidthRequest="100"/>
<StackLayout Orientation="Horizontal">
<Label Text="Verwijderen" FontSize="Small" VerticalTextAlignment="Center" />
<local:CustomImageButton Image="close_zwart.png" BackgroundColor="White" Clicked="Hide_Image_Click" HeightRequest="40" WidthRequest="40" />
</StackLayout>
</StackLayout>
<StackLayout Orientation="Vertical" Margin="10,0,10,0" x:Name="hideImage2" IsVisible="False">
<local:CustomImage HeightRequest="100" WidthRequest="100"/>
<StackLayout Orientation="Horizontal">
<Label Text="Verwijderen" FontSize="Small" VerticalTextAlignment="Center" />
<local:CustomImageButton Image="close_zwart.png" Clicked="Hide_Image_Click" BackgroundColor="White" HeightRequest="40" WidthRequest="40" />
</StackLayout>
</StackLayout>
<StackLayout Orientation="Vertical" Margin="10,0,10,0" x:Name="hideImage3" IsVisible="False">
<local:CustomImage HeightRequest="100" WidthRequest="100"/>
<StackLayout Orientation="Horizontal">
<Label Text="Verwijderen" FontSize="Small" VerticalTextAlignment="Center" />
<local:CustomImageButton Image="close_zwart.png" Clicked="Hide_Image_Click" BackgroundColor="White" HeightRequest="40" WidthRequest="40" />
</StackLayout>
</StackLayout>
</StackLayout>
</StackLayout>
</StackLayout>
</StackLayout>
<StackLayout
AbsoluteLayout.LayoutFlags="All"
AbsoluteLayout.LayoutBounds="1,1,0.25,0.25">
<StackLayout HorizontalOptions="End" VerticalOptions="End" Margin="0,0,0,0">
<local:FloatingActionButton Image="checktaak.png" x:Name="insertTaak" HeightRequest="60" WidthRequest="60" />
</StackLayout>
</StackLayout>
</AbsoluteLayout>
</ContentPage>
You can find the my floating action button at the bottom of all the code ( the last stacklayout). if you need more code let me know in the comments.
Edit I want the button always there even if it overlaps a other stacklayout
Assuming FloatingActionButton inherits from Button and the AbsoluteLayout is the child of a ContentPage and the expected margin for the floating button as (15,15) from right and bottom borders,
<AbsoluteLayout>
<!-- SOME OTHER ELEMENTS -->
<local:FloatingActionButton Image="checktaak.png"
CornerRadius="30"
WidthRequest="60" HeightRequest="60"
AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="1,1,75,75"
HorizontalOptions="Center" VerticalOptions="Center" />
</AbsoluteLayout>
To NOTE,
Use AbsoluteLayout.LayoutFlags="PositionProportional" to make
only the positioning proportional
Then for AbsoluteLayout.LayoutBounds set X and Y, 1 and 1 to
push it to the bottom right corner. The Width and Height is set
to 75 and 75 to position the element 75 points left from the layout's
right border and 75 points top from the layout's bottom border.
The 75 is calculated as,
60(element width/height request) + 15(right/bottom margin) = 75
Since the WidthRequest and HeightRequest is 60, half of it 30
will be the CornerRadius of the element.
Found it!
Just had to tweak the layoutbounds a little, I didn't knew I could go over 1.
This is my new layoutbound for the stacklayout that includes the fab:
AbsoluteLayout.LayoutBounds="0.94,1.18,0.5,0.25"
When I select succes and development the trail screen is the one that follows but in the menu there is no such space, but from the menu to the trial page, in between these two is the masterpage
[
[1
I want remove this space in white, but i did not not add padding in contentpage, I dont know what to do, however I added a NavigationPage.HasNavigationBar=true, but I cant control on top before of NavigationBar.
Also if I add padding to the contentpage it is only modified after the NavigationBar.
I've noticed if changed emulator of api 19 this space in white not exist.
The screenshots are, on the left: 5.2 Marshmallow(6.0.0)XXHDPI Phone (Android 6.0 -Api 23) and right is: 5 Kitkat (4.4) XXHDPI Phone (Andoid 4.4 - API 19)
this is my code xml:
<?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="DefinityFirst.Mobile.Pages.SuccessAndDev.Dashboard"
xmlns:ctrl="clr-namespace:DefinityFirst.Mobile.Pages.SuccessAndDev.Accordion;assembly=DefinityFirst.Mobile"
Title="Trails"
NavigationPage.HasNavigationBar="true"
xmlns:control="clr-namespace:DefinityFirst.Mobile.Pages.SuccessAndDev;assembly=DefinityFirst.Mobile"
>
<!--<ContentPage.Padding>
<OnPlatform x:Key="GeneralPadding2"
x:TypeArguments="Thickness"
iOS="10"
Android="0,10,0,0"
WinPhone="15"/>
</ContentPage.Padding>-->
<!--<ContentPage.Padding>
<OnPlatform x:TypeArguments="Thickness" iOS="20, 40, 20, 20" Android="20, 20, 20, 20" WinPhone="20, 20, 20, 20" />
</ContentPage.Padding>-->
<ContentPage.Content>
<ContentView>
<!--CONTENEDOR TRAIL; LEVEL; PROGRESBAR-->
<StackLayout BackgroundColor="#F5F5F5">
<Frame Padding="3,1,1,2.5" HasShadow="True" Margin="10">
<StackLayout BackgroundColor="#E1E1E1">
<StackLayout Orientation="Vertical" BackgroundColor="#1F549D" Padding="5,0,0,0">
<StackLayout Orientation="Vertical" Padding="5,5,5,5" x:Name="stTrails" BackgroundColor="White">
<Label Text="{Binding Name}" TextColor="#FF020202" FontSize="18" FontAttributes="Bold"/>
<StackLayout Orientation="Horizontal" x:Name="nameLevel">
<Label Text="{Binding Name}" TextColor="#FF020202" FontSize="16" HorizontalOptions="StartAndExpand"/>
<Image Source="mayorq.png" HorizontalOptions="EndAndExpand"/>
</StackLayout>
<StackLayout Orientation="Vertical">
<ProgressBar Progress="{Binding ProgressLevel}" WidthRequest="500" HeightRequest="15" HorizontalOptions="StartAndExpand" x:Name="progresBar"/>
<!--<control:CustomProgressBar x:Name="progressBar2" Progress=".02" />-->
</StackLayout>
</StackLayout>
</StackLayout>
</StackLayout>
</Frame>
<StackLayout Orientation="Horizontal" Padding="4,1,1,2.5">
<Label Text="Item List" FontSize="15.8" HorizontalOptions="StartAndExpand" Margin="10"/>
<Picker x:Name="pickerStatusFilter" Title="Filter by status" HorizontalOptions="EndAndExpand" TextColor="#FF020202"/>
</StackLayout>
<!--<BoxView/>
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" Spacing="50">
<Button Text="a" HorizontalOptions="FillAndExpand" TextColor="{StaticResource MainColor}" BackgroundColor="Aqua"/>
<Button Style="{StaticResource MainButton}" Text="b"/>
<Button Text="c" HorizontalOptions="FillAndExpand"/>
</StackLayout>-->
<!--<StackLayout Orientation="Horizontal">
</StackLayout>-->
<!--ACCORDION-->
<StackLayout Padding="0,0,0,0" BackgroundColor="White">
<ScrollView>
<ctrl:Accordion x:Name="SecOne" FirstExpaned = "true"/>
</ScrollView>
</StackLayout>
</StackLayout>
</ContentView>
</ContentPage.Content>
</ContentPage>
Master Page:
<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DefinityFirst.Mobile.Pages.SuccessAndDev.MasterPage"
xmlns:pages="clr-namespace:DefinityFirst.Mobile.Pages.SuccessAndDev;assembly=DefinityFirst.Mobile"
NavigationPage.HasNavigationBar="false">
<MasterDetailPage.Master>
<pages:MenuPage x:Name="menuPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage x:Name="Navigator" BarBackgroundColor="{StaticResource MainColor}">
<x:Arguments>
<pages:Dashboard/>
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
I can't reproduce this issue using a MasterDetailPage with the latest Xamarin.Forms 2.3.3.175. Both API 19 and API 23+ are not showing any extra space like shown in your images. Try the sample code from here and see if you have the same issue. If not, I suspect something else is wrong in the implementation of the app. An example of using the MD page:
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:MasterDetailPageNavigation;assembly=MasterDetailPageNavigation"
x:Class="MasterDetailPageNavigation.MainPage">
<MasterDetailPage.Master>
<local:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<local:ContactsPage />
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
If you can update your post with more code of how you are implementing the MDP, I will take a look and update my answer.
I encountered this problem too,
now i decompile xamarin,and found MasterDetailPageRenderer->SetElement(),
if sdk>=21 it set TopPadding = GetStatusBarHeight();
but i find xamarin's source,it changed.
I think will soon be modified.