I am facing a freaking problem in windows phone project.I am designing a page with two buttons on the centre of the page,here is the xaml code:
<StackPanel x:Name="Mainpg00" Visibility="Visible">
<Button Width="200" HorizontalAlignment="Left" Height="200" Click="Button1_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Generate Registration OTP"/>
</Button.Content>
</Button>
<Button Width="200" HorizontalAlignment="Right" Height="200" Click="Button2_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Proceed with OTP"/>
</Button.Content>
</Button>
</StackPanel>
The problem I am facing is that I am unable to set the buttons on the centre of the page.
plz help.
If with centered you mean this:
Then, set the Orientation property of the StackPanel to Horizontal. Here you have the code:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<StackPanel x:Name="Mainpg00" Visibility="Visible" Orientation="Horizontal" HorizontalAlignment="Center">
<Button Width="200" HorizontalAlignment="Left" Height="200" Click="Button1_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Generate Registration OTP"/>
</Button.Content>
</Button>
<Button Width="200" HorizontalAlignment="Right" Height="200" Click="Button2_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Proceed with OTP"/>
</Button.Content>
</Button>
</StackPanel>
</Grid>
Otherwise, if what you want is this:
Then play with alignments and Button sizes:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<StackPanel x:Name="Mainpg00" Visibility="Visible" VerticalAlignment="Center">
<Button Click="Button1_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Generate Registration OTP"/>
</Button.Content>
</Button>
<Button Click="Button2_Click" VerticalAlignment="Center">
<Button.Content>
<TextBlock TextWrapping="Wrap" Text="Proceed with OTP"/>
</Button.Content>
</Button>
</StackPanel>
</Grid>
Related
The code below works fine in Android, however in iOS it's not working as expected. The issue is that the height seems to be any alternative for this solution. Thanks in Advance.
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
<Grid BackgroundColor="White" ColumnSpacing="5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Label Text="{Binding Key.OperationId}" IsVisible="false"/>
<Image Source="{Binding Key.ImageUrl}" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" WidthRequest="50" HeightRequest="50" VerticalOptions="StartAndExpand" HorizontalOptions="StartAndExpand" />
<Label Text="{Binding Key.Description}" Grid.Row="0" Grid.Column="1" FontAttributes="Bold" TextColor="Black"
VerticalOptions="StartAndExpand" HorizontalOptions="StartAndExpand" FontSize="15" />
<Label Text="{Binding Key.Code}" Grid.Row="1" Grid.Column="1" TextColor="Black" VerticalOptions="StartAndExpand" HorizontalOptions="StartAndExpand" FontSize="15" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
This potential issue is being tracked on this thread: https://github.com/xamarin/Xamarin.Forms/issues/3769
There is a gist in the comments suggesting creating a custom renderer to fix the ListView GroupHeader size in iOS: https://gist.github.com/nbevans/a713dc9c77a8f530b6f4f3cd4fad83c2
Reference link.
I am making a demo project. I have implemented listview in xamarin view and binding data from API. In first place it looks proper but as I scroll the list starts getting overlap and gets more overlap as I am scrolling to the end point of screen. I have tried with various solutions but did not get solution. It will be great if anyone can help me out with it.
this is my code
<ListView x:Name="UserListView" VerticalOptions="FillAndExpand" HasUnevenRows="True" RowHeight="100" IsVisible="true" VerticalScrollBarVisibility="Never" >
<ListView.ItemTemplate >
<DataTemplate>
<ViewCell>
<ScrollView>
<StackLayout>
<Frame BackgroundColor="Transparent" Padding="0" HeightRequest="100" HasShadow="False">
<StackLayout Orientation="Horizontal" Margin="15,15,15,15" >
<Image Source="image.png" />
<Label Text="{Binding id}" TextColor="Black" />
<Label Text="{Binding title}" TextColor="Black" />
<Label Text="{Binding userId}" TextColor="Black" />
<Label Text="{Binding completed}" TextColor="Black" />
</StackLayout>
</Frame>
</StackLayout>
</ScrollView>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Xamarin.Forms permits ListView cell reuse through the ListViewCachingStrategy enumeration, which has the following values:
public enum ListViewCachingStrategy
{
RetainElement, // the default value
RecycleElement,
RecycleElementAndDataTemplate
}
The RecycleElement caching strategy specifies that the ListView will attempt to minimize its memory footprint and execution speed by recycling list cells.
Here you need to use CachingStrategy="RecycleElement" could solve this problem.
As follows:
<ListView x:Name="UserListView"
VerticalOptions="FillAndExpand"
HasUnevenRows="True"
RowHeight="100"
IsVisible="true"
VerticalScrollBarVisibility="Never"
CachingStrategy="RecycleElement">
...
</ListView>
<DataTemplate>
<ViewCell>
<StackLayout>
<Frame BackgroundColor="Transparent" Padding="0" CornerRadius="0" Margin="0,-5,0,0" HeightRequest="100" HasShadow="False" BorderColor="Black">
<Frame IsClippedToBounds="True" VerticalOptions="Center" CornerRadius="0" Margin="0,-10,0,0" BackgroundColor="White" Padding="0" HeightRequest="90">
<StackLayout Orientation="Horizontal" Margin="15,15,15,15" >
<Image Source="image.png" />
<Label Text="{Binding id}" TextColor="Black" />
<Label Text="{Binding title}" TextColor="Black" />
<Label Text="{Binding userId}" TextColor="Black" />
<Label Text="{Binding completed}" TextColor="Black" />
</StackLayout>
</Frame>
</Frame>
</StackLayout>
</ViewCell>
</DataTemplate>
Worked for me by adding a frame inside a frame and make it IsClippedToBounds ="True".
Thank you for your answers.
I have the following problem. I created a Dialog where you are supposed to add entries into a ListBox. Each ListBoxItem consits of a TextBox for the Product Name and the Product Price (theses are properties of the Product class). Each ListBoxItem also has a ComboBox to choose a unit for the Product (e.g. kilograms, litres, or pieces).
I want the SelectedItem of the ComboBox to be bound to the Content of the Label adjacent to the Price TextBox so that the Label reads "€/SelectedItem" (e.g "€/kg").
But when I run the following code, I get an ArgumentException. Hope somebody can help me.
<ListBox Name="lbProducts" SelectionMode="Single">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="75" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="75" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<TextBox Name="tbDProductName" Grid.Row="0" Grid.ColumnSpan="4" Text="{Binding Name}" FontSize="16" AcceptsReturn="False" AcceptsTab="False" Background="White" BorderBrush="Black" />
<TextBox Name="tbDPrice" Grid.Row="1" Grid.Column="0" Text="{Binding Price}" FontSize="16" AcceptsReturn="False" AcceptsTab="False" FontWeight="Bold" />
<Label Name="lbDPriceSign" Content="{Binding ElementName=cbDAmount, Path=SelectedItem}" FontSize="16" Grid.Row="1" Grid.Column="1"/>
<ComboBox Name="cbDAmount" FontSize="16" Grid.Row="1" Grid.Column="3">
<ComboBoxItem Content="kg" IsSelected="True"/>
<ComboBoxItem Content="l"/>
<ComboBoxItem Content="Stk"/>
</ComboBox>
<TextBox Name="tbDAmount" Grid.Row="1" Grid.Column="2" Text="{Binding Amount}" FontSize="16" AcceptsReturn="False" AcceptsTab="False" FontWeight="Bold" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
I am binding a listbox with contacts address using following xaml code
<ListBox Name="ContactResultsDataLINQ" ItemsSource="{Binding}" Height="200" Margin="24,0,0,0" DataContext="{Binding}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=Addresses[0].PhysicalAddress.AddressLine1, Mode=OneWay}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
However, this only binds AddressLine1...what i want it complete address = AddressLine1 + AddressLine2 + City
Now how do i append this additional properties via xaml code ?
Either use two TextBlock elements, or combine it in a single, using Run elements.
<TextBlock>
<Run Text="{Binding Path=Addresses[0].PhysicalAddress.AddressLine1, Mode=OneWay}" />
<Run Text=" " />
<Run Text="{Binding Path=Addresses[0].PhysicalAddress.AddressLine2, Mode=OneWay}" />
<Run Text=" " />
<Run Text="{Binding Path=Addresses[0].PhysicalAddress.City, Mode=OneWay}" />
</TextBlock>
I'm using mvvm-light.
i;m trying to create an application with one side command button and the other side place holder for views.
when i try to create the view by command i get the ToString name of the ViewModel.
For Example : LU.ViewModel.ChannelsViewModel
What i'm missing?
here is my code:
mainWindow
New Channel
<ContentControl x:Name="_placeholder"
x:FieldModifier="private"
Margin="16"
HorizontalContentAlignment="Center"
VerticalContentAlignment="Center"
Content="{Binding CurrentViewModel , Mode=OneWay}"/>
</StackPanel>
resources:
of the CustomerViewModel class shown in the main window.
-->
ChannelView
<Grid Margin="4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="6" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="30" />
<RowDefinition Height="Auto" />
<RowDefinition Height="30" />
<RowDefinition Height="Auto" />
<RowDefinition Height="30" />
<RowDefinition Height="Auto" />
<RowDefinition Height="30" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.Resources>
<DataTemplate DataType="{x:Type ValidationError}">
<TextBlock
FontStyle="Italic"
Foreground="Red"
HorizontalAlignment="Right"
Margin="0,1"
Text="{Binding Path=ErrorContent}"
/>
</DataTemplate>
</Grid.Resources>
<!-- NAME-->
<Label
Grid.Row="0" Grid.Column="0"
Content="Name:"
HorizontalAlignment="Right"
Target="{Binding ElementName=NameTxt}"
/>
<TextBox
x:Name="NameTxt"
Grid.Row="0" Grid.Column="2"
Text="{Binding ChannelName, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}"
Validation.ErrorTemplate="{x:Null}"
/>
<ContentPresenter
Grid.Row="1" Grid.Column="2"
Content="{Binding ElementName=NameTxt, Path=(Validation.Errors).CurrentItem}"
/>
<!-- IP-->
<Label
Grid.Row="2" Grid.Column="0"
Content="IP:"
HorizontalAlignment="Right"
Target="{Binding ElementName=IPTxt}"
/>
<TextBox
x:Name="IPTxt"
Grid.Row="2" Grid.Column="2"
Text="{Binding IP, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}"
Validation.ErrorTemplate="{x:Null}"
/>
<ContentPresenter
Grid.Row="3" Grid.Column="2"
Content="{Binding ElementName=IPTxt, Path=(Validation.Errors).CurrentItem}"
/>
<!-- Control Port-->
<Label
Grid.Row="4" Grid.Column="0"
Content="Control port:"
HorizontalAlignment="Right"
Target="{Binding ElementName=controlPortTxt}"
/>
<TextBox
x:Name="controlPortTxt"
Grid.Row="4" Grid.Column="2"
Text="{Binding ControlPort, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}"
Validation.ErrorTemplate="{x:Null}"
/>
<ContentPresenter
Grid.Row="5" Grid.Column="2"
Content="{Binding ElementName=controlPortTxt, Path=(Validation.Errors).CurrentItem}"
/>
<!-- data Port-->
<Label
Grid.Row="6" Grid.Column="0"
Content="Data port:"
HorizontalAlignment="Right"
Target="{Binding ElementName=dataPortTxt}"
/>
<TextBox
x:Name="dataPortTxt"
Grid.Row="6" Grid.Column="2"
Text="{Binding DataPort, ValidatesOnDataErrors=True, UpdateSourceTrigger=PropertyChanged}"
Validation.ErrorTemplate="{x:Null}"
/>
<ContentPresenter
Grid.Row="7" Grid.Column="2"
Content="{Binding ElementName=dataPortTxt, Path=(Validation.Errors).CurrentItem}"
/>
<!-- SAVE BUTTON -->
<Button
Grid.Row="8" Grid.Column="2"
Command="{Binding SaveCommand}"
Content="_Save"
HorizontalAlignment="Right"
Margin="4,2"
MinWidth="60"
/>
</Grid>
that works for me, but im not sure if its a good practice:
<UserControl.Resources>
<DataTemplate DataType="{x:Type vm:SimpleReflectionViewModel}">
<view:SimpleReflecionView></view:SimpleReflecionView>
</DataTemplate>
</UserControl.Resources>
<ContentControl Margin="4,0,4,4" HorizontalAlignment="Center" VerticalAlignment="Bottom" Content="{Binding CurrentViewModel}" />
//CurrentViewModel is a property of type ViewModelBase
I ran into the same issue. My problem was that my view was not bound to my viewmodel correctly.
You must make sure you have something like this declared:
<DataTemplate DataType="{x:Type vma:InlineDepartmentsViewModel}">
<va:InlineDepartmentsView/>
</DataTemplate>
This was located in my MainSkin.xaml. Also make sure that in your view, you set your binding as well.
DataContext="{Binding InlineDepartments, Source={StaticResource Locator}}"
Where InlineDepartments would be the name of the property in your view locator.
You're always going to get that if you set the "Content" property with a complex object (ex: a ViewModel).
Instead of binding your ViewModel to the "Content" bind it to the "DataContext" instead.
If you really want to bind it to Content then your gonna have to bind to a property of your ViewModel and not just the ViewModel itself ex:
Content="{Binding CurrentViewModel.SomeStringPropertyInMyVM , Mode=OneWay}"/>