Listpicker unclickable - binding

I have written a listbox to display the "Engine Size" of a set of data from an XML sheet, the item binding seems to work, and the listbox works prefectly for the first two options however the rest are completly unclickable.
I have tried breaks in the code and it is showing that clicking on one of the not working values doesnt even trigger the "ListPicker_ChangedSelection" program i have.
The code I have is below.
private void Choose_Engine_Size_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
String carenginesize=((enginesize)Choose_Engine_Size.SelectedItem).Esize.ToString();
List<enginesize> enginesize =GetCarData();
foreach (enginesize c in enginesize)
{
if(c.Esize==carenginesize)
{
ConsumptionBox.Text=c.Consumption;
EmmissionsBox.Text=c.Emissions;
}
}
From this is then goes to make some caluclation with the populated values from this.
My Listpicker code is as follows:
<toolkit:ListPicker HorizontalAlignment="Left" Margin="287,22,0,0" x:Name="Choose_Engine_Size" VerticalAlignment="Top" Width="72" SelectionChanged="Choose_Engine_Size_SelectionChanged" Height="Auto" Opacity="1">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Border>
<TextBlock Text="{Binding Esize}" FontSize="20" Width="Auto" HorizontalAlignment="Center"/>
</Border>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
</toolkit:ListPicker>

Related

Buttons that start invisible (Binding to false property) don't fire command when made visible later

In my MainPage.xaml I have a CollectionView in a frame and three image buttons in a frame
I'd like the first button to be visible and when I tap it it makes the other two buttons visible and tap again and make the other two buttons invisible.
Seems pretty straightfoward and I can get it working IF they are all visible at first.
If however the other two buttons start off invisible then the button will not respond.
Aside: I also note that hot reload doesn't seem to work if changes made to the controls(views) inside a frame. I tried without the frames and no difference.
Here's the code:
MainPage.xaml
<?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"
xmlns:local="clr-namespace:Census.ViewModels"
x:Class="Census.MainPage">
<Grid
RowDefinitions="*, 65, 100"
RowSpacing="10">
<Frame Grid.Row="0"
CornerRadius="10"
BorderColor="White"
BackgroundColor="Black"
Margin="0,0,0,0">
<CollectionView ItemsSource="{Binding FriendsOC}"
SelectionMode="Single"
SelectedItem="{Binding SelectedItem}"
SelectionChangedCommand="{Binding SelectionChangedCommand}"
SelectionChangedCommandParameter="{Binding .}" >
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid ColumnDefinitions="*, 200">
<Label Grid.Column="0"
Text="{Binding FName}"
FontSize="20"
TextColor="Yellow" />
<Label Grid.Column="1"
Text="{Binding LName}"
FontSize="20"
TextColor="Yellow" />
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</Frame>
<Frame Grid.Row="1"
CornerRadius="10"
BorderColor="White"
BackgroundColor="Black"
HeightRequest="60"
Margin="0,0,0,0"
Padding="0,2,0,0">
<Grid ColumnDefinitions="*, *, *">
<ImageButton Grid.Column="0"
Source="nullx.svg"
BorderColor="Yellow"
BorderWidth="2"
WidthRequest="45"
HeightRequest="45"
Command="{Binding RevealCommand}"/>
<ImageButton Grid.Column="1"
Source="nullx.svg"
BorderColor="Green"
BorderWidth="2"
WidthRequest="45"
HeightRequest="45"
IsVisible="{Binding ImportVisible}"
Command="{Binding ImportFriendsCommand}"/>
<ImageButton Grid.Column="2"
Source="nullx.svg"
BorderColor="Red"
BorderWidth="2"
WidthRequest="45"
HeightRequest="45"
IsVisible="{Binding DestroyVisible}"
Command="{Binding DestroyCommand}"/>
</Grid>
</Frame>
<Button Grid.Row="2"
Text="Add"
Command="{Binding AddFriendCommand}"
WidthRequest="100"
Margin="25,25,25,25"/>
</Grid>
</ContentPage>
MainPage.xaml.cs
namespace Census;
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
BindingContext = new CensusViewModel();
}
protected override void OnAppearing()
{
base.OnAppearing();
//ImportVisible = false; <--things I tried to no avail
//DestroyVisible = false;
//FriendsList.ItemsSource = await App.Friends.GetFriendsAsync(); //because App.xaml.cs is where th db code is
}
}
and the viewmodel
namespace Census.ViewModels;
public partial class CensusViewModel : ObservableObject
{
[ObservableProperty]
public bool importVisible = true;
[ObservableProperty]
public bool destroyVisible = true;
...
//Reveal Actions
public ICommand RevealCommand => new Command(() =>
{
Console.WriteLine("Reveal");
ImportVisible = !ImportVisible;
DestroyVisible = !DestroyVisible;
});
...
}
This works fine
but if I do
[ObservableProperty]
public bool importVisible = false;
[ObservableProperty]
public bool destroyVisible = false;
It works in terms of hiding the two buttons, but does not respond if I tap the first button, except it does hit the code and change the properties.
Now in my head I am thinking of a question I asked here .net Maui databinding to shell flyout item IsVisible property
I've tried different variation on a theme but haven't been able to figure out what I could do. (Hence why I use the code binding in the codebehind as per the solution.
Just seems so bizarre that it works when the properties start off true and works fine, but not when false.
I've spent a good many hours on this by the way so I do try hard to figure it out myself.

Xamarin Form: Select ViewCell data through Button

I have a ListView in which I have button. And I want to select the ViewCell's data when I click on the button.
Here is my XAML code
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<!--<Image Source="{Binding image, Converter={StaticResource ByteArrayToImage}}" HeightRequest="50" WidthRequest="50" />-->
<StackLayout Padding="6" HorizontalOptions="StartAndExpand">
<Label Text="{Binding strItemName}" FontSize="13"
/>
<Label Text="{Binding numSalePrice, StringFormat='Rs. {0:N}'}" FontSize="11"
TextColor="#da3043" />
</StackLayout>
<Button Text="Add To Cart" WidthRequest="100"
HeightRequest="31"
BackgroundColor="#10c3f2"
FontSize="10"
TextColor="White"
VerticalOptions="Center" Clicked="Button_Clicked" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
I don't want to work with ViewCellTap, I need to get the ViewCell's data from the button inside the ListView.
you can bind the data to CommandParameter
<Button CommandParameter="{Binding .}" ...
then in your event handler
protected void Button_Clicked(object sender, EventArgs a)
{
// assuming your data is a type MyClass
var item = (MyClass)((Button)sender).CommandParameter;
// now you can ref item.strItemName, item.numSalePrice, etc
}

ListView moving on Keyboard activation in IOS xamarin forms

I have a problem with Entry and ListView in Xamarin Forms. On Android, it works perfectly but on IOS when Focus is set on Entry, ListView will be moved up like on the image:
I tried to use a render:
How do I keep the keyboard from covering my UI instead of resizing it?
but it didn't solve a problem, in my case because I need ListView moved not the whole page! I also found that this was a known issue:
https://bugzilla.xamarin.com/show_bug.cgi?id=45336
https://www.youtube.com/watch?v=1xwDRT_CnoM&feature=youtu.be
Any suggestions how to turn off moving elements when the keyboard is activated?
And I need Focus set to true in this case!
The code in XAML is next:
<myControls:MyEntry Grid.Row="0" Style="{DynamicResource EntryControlStyle}"
x:Name="CityEntry" AutomationId="SearchCityEntry"
Placeholder="{Binding TravelType, Converter={StaticResource LanguageConverter}, Mode=OneWay}"
Text="{Binding Path=SearchQuery}" />
<myControls:MyListControl
Grid.Row="1"
SeparatorVisibility="None"
HasUnevenRows="True"
IsRefreshing="{Binding IsRefreshing}"
RefreshCommand="{Binding RefreshCommand}"
x:Name="SelectCity"
ItemsSource="{Binding Path=SearchResults}"
SelectedItem="{Binding SelectedCity}">
<myControls:MyListControl.ItemTemplate>
<DataTemplate>
<ViewCell>
<ContentView BackgroundColor="White">
<Grid Margin="10,10,0,10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.4*" />
<ColumnDefinition Width="4*" />
</Grid.ColumnDefinitions>
<StackLayout Grid.Column="0" HorizontalOptions="Start"
VerticalOptions="Start">
<Image HorizontalOptions="Start" VerticalOptions="Start"
Source="{Binding LocationSource,Converter={StaticResource LocationSourceEnumToImageConverter} }" />
</StackLayout>
<Label Grid.Column="1" AutomationId="SearchCityList"
HorizontalOptions="StartAndExpand"
Text="{Binding Path=Name, Mode=TwoWay}"
Style="{DynamicResource EntryControlStyle}" />
</Grid>
</ContentView>
</ViewCell>
</DataTemplate>
and code behind:
protected override void OnAppearing()
{
base.OnAppearing();
CityEntry.Focus();
}
protected override void OnDisappearing()
{
CityEntry.Unfocus();
base.OnDisappearing();
}
protected override bool OnBackButtonPressed()
{
CityEntry.Unfocus();
return base.OnBackButtonPressed();
}

listbox not showing all items windows phone 8.1

I'm trying to populate a listbox using binding in windows phone 8.1. I can't see all of the items in the control.
XAML:
<Grid x:Name="LayoutRoot">
<Grid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition/>
</TransitionCollection>
</Grid.ChildrenTransitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- Title Panel -->
<StackPanel Grid.Row="0" Margin="19,0,0,0">
<TextBlock Text="Application Name" Style="{ThemeResource HeaderTextBlockStyle}" CharacterSpacing="{ThemeResource PivotHeaderItemCharacterSpacing}"/>
</StackPanel>
<StackPanel Grid.Row="1" x:Name="ContentRoot" Margin="19,0,19,0">
<ComboBox
x:Name="ComboBox1"
ItemsSource="{Binding}"
HorizontalAlignment="Stretch"
VerticalAlignment="Top"
SelectionChanged="ComboBox1_SelectionChanged"
/>
<ListBox x:Name="ListBox1" ItemsSource="{Binding}" Height="1000">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical" Margin="0">
<TextBlock Text="{Binding GameName}" Margin="2"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</Grid>
I populate the listbox in code:
private ObservableCollection<Game> _Games = new ObservableCollection<Game>();
public StartPage()
{
this.InitializeComponent();
this.navigationHelper = new NavigationHelper(this);
this.navigationHelper.LoadState += this.NavigationHelper_LoadState;
this.navigationHelper.SaveState += this.NavigationHelper_SaveState;
ListBox1.DataContext = _Games;
}
....
private async void ComboBox1_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var group = _Groups[ComboBox1.SelectedIndex];
games = await DataServer.GetGamesAsync(group.GroupName);
_Games.Clear();
foreach (var game in games.OrderBy(g => g.GameName))
{
_Games.Add(game);
}
}
There are 69 games but I can only see about 28 in the list view in the emulator when I scroll the list. It's clear that there are more items in the list, but I can't scroll to them. Any help is appreciated.
Replace the StackPanel with a Grid and add a couple more RowDefinitions in the second Grid you'll add. StackPanels don't size themselves dynamically, so instead of sizing to the screen, it's just stretched infinitely to the bottom.

issues with loading images in custom control

I am new to the WP7 platform and I am facing something strange, I have a custom component that has an image. (Part of the custom component below)
<Rectangle x:Name="ImageForeground" Height="240" Width="240" HorizontalAlignment="Center" VerticalAlignment="Center" Fill="{TemplateBinding Foreground}"
DataContext="{TemplateBinding Image}"
OpacityMask="{Binding Converter={StaticResource brushConverter}}" />
Here is the brushConverter
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
BitmapImage image = (BitmapImage)value;
ImageBrush imageBrush = new ImageBrush();
if (image != null)
{
imageBrush.ImageSource = image;
}
return imageBrush;
}
Now i add the custom component to a page with
<rounded:RoundedImageView Image="/Images/image1.png"/>
Here comes the weird part. The component only displays certain png images!! I have 5 all in all, with ALL their Build Action properties set to Content. But the control only loads some and not all. Even stranger is if i put the images in a regular Image component like so
<Image Height="200" HorizontalAlignment="Left" Margin="54,17,0,0" Name="image3" Stretch="Fill" VerticalAlignment="Top" Width="200" Source="/Images/service_reload.png" />
It works!!! WTF!!
Any ideas?!
Solved:
Solved: I attached the brushConverter binding to the Fill property of the Rectangle instead of the OpacityMask property and it worked like a charm
<Rectangle x:Name="ImageForeground" Height="240" Width="240" HorizontalAlignment="Center" VerticalAlignment="Center" DataContext="{TemplateBinding Image}" Fill="{Binding Converter={StaticResource brushConverter}}" />

Resources