Xamarin forms UWP fixed width - xamarin

When run in a Windows environment a Xamarin Forms UWP app can be resized (vs a tablet environment which is always full screen).
Is there a way to set a minimum width for the window? MinimumWidthRequest on the page doesn't seem to do the job. By default the app won't go below 500px in width (not sure where that setting comes from), but I want that value to be 1000px.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:SampleApp"
MinimumWidthRequest="1000"
x:Class="SampleApp.MainPage">
<StackLayout>
<!-- Place new controls here -->
<Label Text="Welcome to Xamarin.Forms!"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage>

You need to do it on page renderer
within OnElementChanged add this.
ApplicationView.PreferredLaunchViewSize = new Size(1000, 1000);
ApplicationView.PreferredLaunchWindowingMode = ApplicationViewWindowingMode.PreferredLaunchViewSize;
Reference

Related

How to make this progress bar vertically in xamarin forms

I want to create this ui design in xamarin forms, as progress bar should look like this vertically.
To make the ProgressBar vertical, I have an easy solution for that.You can refer to the XAML below. It could help you.
Xaml:
<StackLayout Rotation="-90" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
<ProgressBar Progress="1" ProgressColor="Orange" >
</ProgressBar>
</StackLayout>

Xamarin Forms Rotated ListView Spins on Redraw

To make a chat page, I followed an example I found that sets the ListView rotation to 180, so the list builds from the bottom and then set things in the DataTemplate to rotate 180, so the items will be upright. It's a great solution, but when the keyboard opens, the ListView gets shorter which causes a redraw. During the redraw, the ListView initially appears with rotation 0 and I see an animation as if RotateTo(360) is being called. After initially displaying, I get to watch the list view rotate around in full circle. Click off the message editor, and the ListView gets taller, and it does it again.
Has anyone seen this?
Here's what the Xaml looks like. I can't make a gif of what it looks like, but imagine watching:
MessageList.Rotation = 0;
MessageList.RotateTo(360, 500, Easing.Linear);
each time the keyboard shows and hides, and you'll get the idea...
<ListView
X:Name="MessageList"
AbsoluteLayout.LayoutFlags="All"
AbsoluteLayout.LayoutBounds="0,0,1,1"
Rotation="180"
ItemsSource="{Binding ChatMessages}"
SelectionMode="None"
HasUnevenRows="True"
SeparatorColor="Transparent">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Frame
BackgroundColor="LightGray"
FlowDirection="LeftToRight"
Rotation="180"
Padding="10"
HasShadow="false"
Margin="80,2,0,5">
<Label Text="{Binding ChatText}"/>
</Frame>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I followed the same tutorial you mentioned and you are probably using a ContentPage renderer to handle your keyboard layout updates on iOS. If you check the sample project https://github.com/rdelrosario/ChatUIXForms you'll notice he resizes the keyboard ContentView with a ContentView renderer for the Editor box at the bottom using the Margin property, rather than the entire ContentPage. Which doesn't trigger the above issue.
What I wound up doing was to make a custom ListView renderer that was keyboard aware in iOS and sets a translation X to move the top of the listview up when the keyboard appears and back down when it goes away. As a result, the listview is not getting resized, and thus does not redraw.
It may be messy, but it makes it work...

How to make icon size same in landscape mode and potrait mode in xamarin forms

I am a beginner in xamarin.forms. I am using Xamarin.forms Absolute layout for identifying the message count. When in potrait mode, it works fine. In landscape mode, it is giving an enlarged icon. Is there a way we can change this ? Please suggest .
Here is my Xaml file:
<effect:BudocodeButton x:Name="chatMsgCnt" AbsoluteLayout.LayoutBounds=".9,0,.4,.9" BorderRadius="12"
AbsoluteLayout.LayoutFlags="PositionProportional,SizeProportional" BackgroundColor="Red" TextColor="White" FontSize="Medium" Text="{Binding ChatMsgCount}" FontAttributes="Bold" >
landscapeimg
potraitimage
Make your hight and the width static for the view and set AbsoluteLayout.LayoutFlags to X&Y Proportional.
Code:
<effect:BudocodeButton
x:Name="chatMsgCnt"
AbsoluteLayout.LayoutBounds=".9,0,60,60"
BorderRadius="12"
AbsoluteLayout.LayoutFlags="XProportional,YProportional"
BackgroundColor="Red"
TextColor="White"
FontSize="Medium"
Text="{Binding ChatMsgCount}"
FontAttributes="Bold">

Pinch gesture in Xamarin forms not working on Android when positioned over another control

I have a page that has a grid that contains a dynamic number of controls within it and each control has it's own tap event. I need to be able to pinch on this grid to add or remove columns. On iOS this works perfectly well. However, on Android, the pinch gesture only works if it's done in an area of the screen where there are no controls. If I try to pinch over any of the controls, nothing happens. I added some debugging statements, and it doesn't look the pinch event is even fired. It almost appears as if the the controls are swallowing the finger down and not allowing the pinch to fire. The relevant code is posted below (the 'xxxx's are where I had to redact some of the code).
The XAML:
<ContentPage x:Class="xxxxx"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml">
<Grid RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<xxxxxx x:Name="xxxxx" Grid.Row="0" />
<ScrollView Grid.Row="1">
<Grid x:Name="ContentGrid"
ColumnSpacing="4"
RowSpacing="4"/>
</ScrollView>
</Grid>
</ContentPage>
The Constructor:
private PinchGestureRecognizer pinch;
public xxxxx()
{
InitializeComponent();
pinch = new PinchGestureRecognizer();
pinch.PinchUpdated += Zoom;
ContentGrid.GestureRecognizers.Add(pinch);
}
Filling in the grid (I had to cut this down to only the relevant portion):
var tapGesture = new TapGestureRecognizer();
tapGesture.Tapped += OnCtrlTapped;
ctrl.GestureRecognizers.Add(tapGesture);
ContentGrid.Children.Add(ctrl, colIndex, rowIndex);
I didn't include the Zoom method because it works correctly when fired. The problem as mentioned above is that doesn't fire when the pinch occurs over the controls. Am I running up against a bug that I don't know about, or did I do something to cause the conflict?
Just in case anybody runs across this in the future, what we ended up doing was placing another view over the Grid and proxying the gestures through.

iOS status bar with Xamarin Forms app

I am writing a Xamarin cross platform forms app.
Here is my main page XAML:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="XXX.YYYY">
<TabbedPage.Children>
<ContentPage Title="Page1" >
<StackLayout Orientation="Vertical">
<SearchBar Placeholder="" Text="">
</SearchBar>
<ListView x:Name="listView1" />
</StackLayout>
</ContentPage>
...
And here is the result in iOS simulator:
As you can see, i have a problem with status bar on the top of the screen.
I have solved the problem by adding 20px padding on the top, but i think this solution is ugly (let's imagine Apple wants to grow this status bar to 30px in future iOS release...)
Is there a way to say to xamarin to "pack" content bellow the status bar ?
I have also tried to hide status bar (with checkbox in plist file in iOS project) but it does not work...
Thanks
This is by design, you will have to apply a padding to the top or set a NavigationPage to App.Current.MainPage. This will take care of the padding.

Resources