Homepage showing products in a list according to the category selected.Initially showing products of first category. API response is null for first category but count is correct,showing only blank frames. After switching from other categories, products are shown correctly.Awaited the tasks. I think the problem is with async-await calls.Help need to rectify this..
private async Task InitializeAsync()
{
await Get_categories(); //calling method
}
public Task Initialization { get; private set; }
public Grid_vm() //constructor
{
Initialization = InitializeAsync();
}
public async Task Get_categories()
{
var items = await restClient.Get_categories();
Categorylist = new List<Category_value>();
foreach (Category_data cat in items.data)
{
Category_value category = new Category_value();
if (cat.category_id=="6")
{
category.category_id = cat.category_id;
category.category_name = cat.category_name;
Categorylist.Add(category);
}
else
{
category.category_id = cat.category_id;
category.category_name = cat.category_name;
Categorylist.Add(category);
}
}
await Get_branch_products("6") ; // calling first category
}
public async Task Get_branch_products (string category_id)
{
RestClient restClient = new RestClient();
var items=await restClient.Get_branch_products2(category_id);//calling restAPI
Productlist = new List<Product_Value2>();//var items null initially
foreach (Product_Data p in items.data)
{
Product_Value2 val = new Product_Value2();
val.available_qty = p.available_qty;
if (p.status == "1")
{
val.visible = true ;
OnPropertyChanged("visible");
val.visibility = false;
OnPropertyChanged("visibility");
Productlist.Add(val);
}
else
{
val.visible = true ;
OnPropertyChanged("visible");
val.visibility = false;
OnPropertyChanged("visibility");
val.opacity = 0.25;
OnPropertyChanged("opacity");
Productlist.Add(val);
}
}
}
}
public async Task<ProductDetails> Get_branch_products2(string cat_id)
{
var formcontent = new FormUrlEncodedContent(new[]
{
new KeyValuePair<string,string>("category_id",cat_id)
});
var response = await client.PostAsync(base_url + "listbranchproduct", formcontent).ConfigureAwait(false);//execution returns null from here
var result = await response.Content.ReadAsStringAsync();//executed later
var status = JsonConvert.DeserializeObject<ProductDetails>(result);
return status;
}
<ListView x:Name="pdt_list" HasUnevenRows="True" SeparatorVisibility="None" ItemsSource="{Binding Productlist}" BackgroundColor="White" Margin="0,0,0,0">
<ListView.ItemTemplate>
<DataTemplate >
<ViewCell >
<ViewCell.View>
<Frame HasShadow="False" Margin=" 0,10,0,10" Padding="10,0,10,5" BackgroundColor="#f1f1f1" HeightRequest="80" HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand" >
<Grid Padding="0">
<!--<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand" Margin="0,10,0,10" >-->
<StackLayout VerticalOptions="FillAndExpand" Margin="0" Padding="10,0,0,0" Orientation="Horizontal" Opacity="{Binding opacity}">
<Image Source="{Binding image}" Aspect="AspectFill" WidthRequest="70" HeightRequest="180" VerticalOptions="FillAndExpand" />
<StackLayout HorizontalOptions="FillAndExpand" Orientation="Vertical" >
<Label Text="{Binding Name}" Font="Bold" VerticalTextAlignment="Center" FontSize="Small" TextColor="Black" FontFamily="opensans_light.ttf#opensans_light" Margin="10,20,0,0" />
<StackLayout Orientation="Horizontal" Margin="10,0,0,0" HorizontalOptions="Start" VerticalOptions="Start" >
<Label Text="{Binding sellingprice_default}" Font="Bold" HorizontalOptions="Start" Margin="0" TextColor="#FA2E27" VerticalTextAlignment="Start" FontSize="Small" FontFamily="opensans_light.ttf#opensans_light" />
<Label Text="QAR" TextColor="#FA2E27" HeightRequest="90" FontSize="Small" HorizontalOptions="Start" VerticalTextAlignment="Start" VerticalOptions="FillAndExpand" />
</StackLayout>
</StackLayout>
<ImageButton Source="carts.png" BackgroundColor="Transparent" IsVisible="{Binding visible}" HorizontalOptions="EndAndExpand" WidthRequest="40" HeightRequest="40" VerticalOptions="CenterAndExpand" Clicked="Add_cart_Clicked" Margin="0,20,0,0" Aspect="AspectFit">
</ImageButton>
<StackLayout Orientation="Horizontal" BackgroundColor="Transparent" IsVisible="{Binding visibility}" HorizontalOptions="EndAndExpand">
<ImageButton Source="minus.png" HorizontalOptions="End" VerticalOptions="Center" Aspect="Fill" BackgroundColor="Transparent" WidthRequest="20" HeightRequest="20" Clicked="Minus_Tapped" />
<Label Text="{Binding Number2}" VerticalTextAlignment="Center" HorizontalOptions="EndAndExpand" FontSize="Medium" TextColor="Black" FontFamily="opensans_light.ttf#opensans_light" Margin="0,0,0,0" />
<ImageButton Source="plus2.png" HorizontalOptions="End" Aspect="Fill" VerticalOptions="Center" BackgroundColor="Transparent" WidthRequest="20" HeightRequest="20" Clicked="Plus_Tapped" />
</StackLayout>
</StackLayout>
<StackLayout BackgroundColor="Black" HorizontalOptions="EndAndExpand" VerticalOptions="StartAndExpand" WidthRequest="100" HeightRequest="25" IsVisible="{Binding opaque}" Margin="0,0,0,0" >
<Label Text="Not Available" FontFamily="opensans_light.ttf#opensans_light" TextColor="White" FontAttributes="Bold" HorizontalOptions="Center" VerticalTextAlignment="Center" />
</StackLayout>
</Grid>
</Frame>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
opacity was provided inside the Get_branch_products (string category_id) method else block as 0.25.
val.opacity = 1;
OnPropertyChanged("opacity");
was not given inside if block adding it there solved the issue.
Related
I am working on TabView control to create multiple tab page using "TabItemSource". In most of the sample provided in open source, the "TextColorSelected" property can be set in xct:TabViewItem. For my case, how can I set "TextColorSelected" property while using TabItemSource?
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:xct="clr-namespace:Xamarin.CommunityToolkit.UI.Views;assembly=Xamarin.CommunityToolkit"
x:Class="MultiPosApp.Restaurant.Views.KitchenOrderTicketView"
xmlns:prism="http://prismlibrary.com"
prism:ViewModelLocator.AutowireViewModel="True"
x:Name="KitchenOrderTicketVM"
Title="Kitchen Order Ticket">
<xct:TabView TabItemsSource="{Binding KitchenOrderCollection}" TabStripPlacement="Top" TabStripBackgroundColor="AliceBlue" TabStripHeight="50" IsSwipeEnabled="False" TabIndicatorColor="Black"
AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" SelectedIndex="{Binding SelectedIdx}">
<xct:TabView.TabViewItemDataTemplate>
<DataTemplate>
<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand">
<Label Text="{Binding Location}"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand"
HorizontalTextAlignment="Center"
VerticalTextAlignment="Center"
TextColor="Black"
FontAttributes="Bold"/>
</StackLayout>
</DataTemplate>
</xct:TabView.TabViewItemDataTemplate>
<xct:TabView.TabContentDataTemplate>
<DataTemplate>
<ScrollView>
<StackLayout BindableLayout.ItemsSource="{Binding TableOrderCollection}" Orientation="Vertical" Margin="3">
<BindableLayout.ItemTemplate>
<DataTemplate>
<Frame BorderColor="LightGray" Padding="10" BackgroundColor="GhostWhite" HasShadow="True" CornerRadius="10">
<StackLayout Orientation="Vertical">
<StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
<Label Text="TABLE " TextColor="Black" FontSize="Large" FontAttributes="Bold"/>
<Label Text="{Binding Table.TableNum}" TextColor="Black" FontSize="Large" FontAttributes="Bold"/>
</StackLayout>
<StackLayout BindableLayout.ItemsSource="{Binding MenuOrderCollection}" Orientation="Vertical">
<BindableLayout.ItemTemplate>
<DataTemplate>
<StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Label Text="{Binding ItemName}" TextColor="Black" FontSize="Medium" VerticalOptions="Center"/>
<Label Text="{Binding ItemQuantity}" TextColor="Black" FontSize="Medium" HorizontalOptions="EndAndExpand" VerticalOptions="Center"/>
<CheckBox IsChecked="{Binding MenuStatus}" IsEnabled="{Binding CheckboxEnabled}" HorizontalOptions="End">
<CheckBox.Behaviors>
<prism:EventToCommandBehavior EventName="CheckedChanged" Command="{Binding Path=BindingContext.ChkboxChangedCommand, Source={x:Reference Name=KitchenOrderTicketVM}}" CommandParameter="{Binding}"/>
</CheckBox.Behaviors>
</CheckBox>
</StackLayout>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</StackLayout>
</Frame>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
</ScrollView>
</DataTemplate>
</xct:TabView.TabContentDataTemplate>
</xct:TabView>
I didn't find a way to set the TextColorSelected property in TabViewItemDataTemplate.
For scenarios where you are not sure of the number of TabViewItems, you could try drawing the layout in code behind.
Something like:
public Page10()
{
InitializeComponent();
....
foreach (var item in tabview.TabItemsSource) //here the tabitemsource is a array of strings for test.
{
var tabViewItem = new TabViewItem
{
Text = (string)item,
TextColor = Color.White,
TextColorSelected = Color.Red,
};
var label = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Text = (string)item
};
tabViewItem.Content = label;
tabview.TabItems.Add(tabViewItem);
}
}
define a x:Name for TabView:
<xct:TabView x:Name="tabview" TabItemsSource="{Binding KitchenOrderCollection}" TabStripPlacement="Top" TabStripBackgroundColor="AliceBlue" TabStripHeight="50" IsSwipeEnabled="False" TabIndicatorColor="Black"
AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All" SelectedIndex="{Binding SelectedIdx}">
...
</xct:TabView>
This is my xaml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="InstagramCloneInterviewApp.MainPage"
x:Name="CurrentPage"
Title="Photos">
<ContentPage.Content>
<Grid>
<StackLayout>
<RefreshView IsRefreshing="{Binding IsRefreshing, Mode=OneWay}"
Command="{Binding LoadRefreshCommand}">
<CollectionView ItemsSource="{Binding Photos}" SelectionMode="Single" SelectedItem="{Binding SelectedPhoto}" RemainingItemsThreshold="{Binding CounterData}" RemainingItemsThresholdReachedCommand="{Binding LoadNewPhotosCommand}" >
<CollectionView.ItemTemplate>
<DataTemplate>
<Grid Padding="10">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<Grid.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Source={x:Reference CurrentPage}, Path=BindingContext.LoadSelectedPhotoCommand}" />
</Grid.GestureRecognizers>
<Image Aspect="AspectFit" HeightRequest="50" Source="{Binding Url}" Grid.Column="0"></Image>
<Label Text="{Binding Title}" Grid.Column="1"></Label>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</RefreshView>
</StackLayout>
<StackLayout HorizontalOptions="CenterAndExpand" VerticalOptions="Center">
<Frame IsVisible="{Binding IsBusy}" BorderColor="#3498DB" HasShadow="False" BackgroundColor="#eeeeee">
<StackLayout>
<ActivityIndicator IsVisible="{Binding IsBusy}" IsRunning="{Binding IsBusy}" HorizontalOptions="Center" VerticalOptions="Center"></ActivityIndicator>
<Label TextColor="#3498DB" Text="Loading Data, Please Wait..." HorizontalTextAlignment="Center" VerticalTextAlignment="Center" HorizontalOptions="Center" VerticalOptions="Center" IsVisible="{Binding IsBusy}"/>
</StackLayout>
</Frame>
</StackLayout>
</Grid>
</ContentPage.Content>
</ContentPage>
This is SelectedPhoto object in the ViewModel:
public Photo SelectedPhoto
{
get { return selectedPhoto; }
set
{
if (selectedPhoto != value)
{
selectedPhoto = value;
SetProperty(ref selectedPhoto, value);
OnPropertyChanged("SelectedPhoto");
}
}
}
This is the task i get from Grid.TapGestureRecognizer and LoadSelectedPhotoCommand:
async Task ExecuteGetDetailsSelectedPhoto()
{
if (IsBusy)
return;
try
{
var test= SelectedPhoto;
}
catch (Exception ex)
{
Debug.WriteLine(ex);
var msg = ex.Message;
}
finally
{
IsBusy = false;
}
}
var test is always null.
It looks like item is not clicked. Does anyone have a similar experience or better idea to fix this?
The problem was Grid TapGesture override all space and SelectMode not working
Below I've attached snippets of my xaml & cs files. I'm trying to bind the entry boxes to the correct properties & the label is to be binded to the total property. I'm obviously going wrong somewhere I just can't put my finger on where. When using WPF I lay out my binding the same way. I've tried googling this & several videos which none seem to help my problem.
XAML
<Label Text="{Binding Total}"
TextColor="Black"
FontSize="50"
Grid.Column="1"
Grid.ColumnSpan="3"
Grid.Row="4"
Grid.RowSpan="1"
VerticalOptions="Center"
HorizontalOptions="Center"/>
<Label Text="APR Amount"
TextColor="Black"
FontSize="16"
Grid.Column="1"
Grid.ColumnSpan="3"
Grid.Row="5"
Grid.RowSpan="1"
VerticalOptions="Center"
HorizontalOptions="Center"/>
<Label Text="£APR"
TextColor="Black"
FontSize="30"
Grid.Column="1"
Grid.ColumnSpan="3"
Grid.Row="6"
Grid.RowSpan="1"
VerticalOptions="Center"
HorizontalOptions="Center"/>
<BoxView Color="CornflowerBlue"
CornerRadius="0"
Grid.Column="0"
Grid.ColumnSpan="5"
Grid.Row="7"
Grid.RowSpan="1"
WidthRequest="700"
HeightRequest="5"
VerticalOptions="Center"
HorizontalOptions="Center" />
<Label Text="Loan Amount"
TextColor="Black"
FontSize="20"
Grid.Column="0"
Grid.ColumnSpan="3"
Grid.Row="9"
Grid.RowSpan="2"
VerticalOptions="Center"
HorizontalOptions="Center"
Margin="0,0,0,0" />
<Entry Grid.Row="9"
Grid.Column="2"
Grid.ColumnSpan="3"
Grid.RowSpan="2"
WidthRequest="120"
VerticalOptions="Center"
HorizontalOptions="End"
Text="{Binding loanLength}"
Margin="0,0,45,0" />
<Label Text="Interest Rate"
TextColor="Black"
FontSize="20"
Grid.Column="0"
Grid.ColumnSpan="3"
Grid.Row="11"
Grid.RowSpan="2"
VerticalOptions="Center"
HorizontalOptions="Center"
Margin="0,0,0,0" />
<Entry Grid.Row="11"
Grid.RowSpan="2"
Grid.Column="2"
Grid.ColumnSpan="3"
WidthRequest="120"
VerticalOptions="Center"
HorizontalOptions="End"
Text="{Binding intRate}"
Margin="0,0,45,0" />
<Label Text="Loan Length (Years)"
TextColor="Black"
FontSize="20"
Grid.Column="0"
Grid.ColumnSpan="3"
Grid.Row="13"
Grid.RowSpan="2"
VerticalOptions="Center"
HorizontalOptions="Center"
Margin="0,0,0,0" />
<Entry Grid.Row="13"
Grid.RowSpan="2"
Grid.Column="2"
Grid.ColumnSpan="3"
WidthRequest="120"
VerticalOptions="Center"
HorizontalOptions="End"
Text="{Binding loanLength}"
Margin="0,0,45,0"/>
C#
private int loanAmount { get; set; }
public int Loan
{
get => loanAmount;
set
{
loanAmount = value;
OnPropertyChanged("Loan");
CalculateAPR();
}
}
private int intRate { get; set; }
public int Interest
{
get => intRate;
set
{
intRate = value;
OnPropertyChanged("Interest");
CalculateAPR();
}
}
private int loanLength { get; set; }
public int Length
{
get => loanLength;
set
{
loanLength = value;
OnPropertyChanged("Length");
CalculateAPR();
}
}
private string total { get; set; }
public string Total
{
get => total;
set
{
total = value;
OnPropertyChanged("Total");
}
}
public void CalculateAPR()
{
if (Interest != 0)
{
Total = "£" + (Loan * Length) / Interest;
}
else
{
Total = "£ -";
}
}
you need to bind to a public property like "Length" or "Interest"
and call PropertyChanged(nameof(loanLength)); for example (with private inside)
check this if you need
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/data-binding-basics
I created a demo to simulate your code,and it worked properly.
There are severals problems in your code:
1.We should bind a public property, for example, you can bind like this:
<Entry
Text="{Binding Loan}"
Margin="0,0,45,0" />
Instead of
<Entry
Text="{Binding loanLength}"
Margin="0,0,45,0" />
The same is true of other fields.
Replace <Entry Text="{Binding intRate }"/> with <Entry Text="{Binding Interest}"/>
and
Replace <Entry Text="{Binding loanLength }"/> with <Entry Text="{Binding Length}"/>
2.Try the following bindingContext code:
<Grid >
<Grid.BindingContext>
<local:ViewModel></local:ViewModel>
</Grid.BindingContext>
<Grid.RowDefinitions>
</Grid.RowDefinitions>
<!--other code-->
</Grid>
After press, the return button on-screen keyboard the listview hide from the iOS screen. The same code is running perfectly on Android. I have create the 30 second video that will help you understand the problem.
The code file and Video can be download from here https://drive.google.com/drive/folders/1Q4O1KexIHvrCX79AR3CesRXJRWM1o2JR?usp=sharing
<ListView x:Name="listViewOrder" ItemTapped="OnActivitySelected" HasUnevenRows="True">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Frame HasShadow="True" OutlineColor="Silver" Padding="3">
<Grid BackgroundColor="{Binding RowColour}" ColumnSpacing="2" Padding="2">
<StackLayout Orientation="Horizontal" HeightRequest="35" BackgroundColor="{Binding RowColour}" Padding="10">
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="Start">
<Label FontSize="Medium" TextColor="#707070" Text="{Binding GFIELD3}" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Image Aspect="AspectFit" Source = "{Binding ImageStatus}" HorizontalOptions="StartAndExpand" VerticalOptions="Center" HeightRequest = "20" WidthRequest="20" />
</StackLayout>
</StackLayout>
</Grid>
</Frame>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<StackLayout x:Name="layoutForBluetooth" HeightRequest="200" Padding="5, 5, 5, 5" BackgroundColor="#5DCBEE" Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Frame Padding="5,5,5,5" HorizontalOptions="FillAndExpand" OutlineColor="Black" HasShadow="True">
<Grid>
<Label Text="Scan Your Barcode" x:Name="lblDriverNumber" TextColor="Black" FontSize="Medium" HorizontalOptions="FillAndExpand" Margin="0,10" />
<Entry x:Name="txtentry" FontSize="Medium" TextColor="Black" WidthRequest="400" HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand" />
</Grid>
</Frame>
async void Txtentry_Completed(object sender, EventArgs e)
{
BiendListview(orderID);
}
public void BiendListview(int OID)
{
try
{
List<GenericFields> GN = new List<GenericFields>();
GN = GetDeliveryOrderItems(OID);
if (GN != null)
{
// listViewOrder.BeginRefresh();
listViewOrder.ItemsSource = GN;
// listViewOrder.EndRefresh();
}
}
catch (Exception ex)
{
}
}
Please make a breakpoint to debug your GN's value. From your code:
if (GN != null)
{
// listViewOrder.BeginRefresh();
listViewOrder.ItemsSource = GN;
// listViewOrder.EndRefresh();
}
This if statement will always be true, since you have construct the GN by List<GenericFields> GN = new List<GenericFields>();. It will never be null.
You can try to modify it to:
if (GN.Count != 0)
{
// listViewOrder.BeginRefresh();
listViewOrder.ItemsSource = GN;
// listViewOrder.EndRefresh();
}
I got these five images and I want to change the opacity of the selected Icon to 1 and then set the rest to 0.25.
I got this far, but got no idea how to change the opacity on all of them. All the guides say to x:reference every single image, but as I got multiple that would get weird quickly.
public async void OnSeverityTapped(object sender, EventArgs args)
{
String[] buttons = new String[SeverityValues.Count];
for (int n = 0; n < SeverityValues.Count; ++n)
{
buttons[n] = SeverityValues[n].Name;
}
var res = await this.DisplayActionSheet("Pick Severity", "Cancel", "", buttons);
if (res != "Cancel")
foreach (var item in SeverityValues)
{
if (item.Name == res)
{
Issue.SeverityEx = item.Value;
lbSeverity.Text = item.Name;
return;
}
}
}
Xaml
<!--Severity-->
<Label Grid.Row="0" Grid.Column="0" Text="SEVERITY" XAlign="Start" YAlign="Center" Style="{StaticResource Labelfont}" />
<Label x:Name="lbSeverity" Grid.Column="1" Text="" YAlign="Center" HorizontalOptions="StartAndExpand" Style="{StaticResource Labelfont}" />
<StackLayout Grid.Row="1" Grid.Column="0" Orientation="Horizontal" Spacing="4">
<Image Source="severity_5.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" Opacity="0.4"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</StackLayout.GestureRecognizers>
</StackLayout>
<StackLayout Grid.Row="1" Grid.Column="1" Orientation="Horizontal" Spacing="4">
<Image Source="severity_4.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" Opacity="0.4"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</StackLayout.GestureRecognizers>
</StackLayout>
<StackLayout Grid.Row="1" Grid.Column="2" Orientation="Horizontal" Spacing="4">
<Image Source="severity_3.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" Opacity="1"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</StackLayout.GestureRecognizers>
</StackLayout>
<StackLayout Grid.Row="1" Grid.Column="3" Orientation="Horizontal" Spacing="4">
<Image Source="severity_2.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" Opacity="0.4"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</StackLayout.GestureRecognizers>
</StackLayout>
<StackLayout Grid.Row="1" Grid.Column="4" Orientation="Horizontal" Spacing="4">
<Image Source="severity_1.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40" Opacity="0.4"/>
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</StackLayout.GestureRecognizers>
</StackLayout>
Your code behind for changing opacity could look like this:
public void OnSeverityTapped(object sender, EventArgs args)
{
severity5.Opacity = 0.25;
severity4.Opacity = 0.25;
severity3.Opacity = 0.25;
severity2.Opacity = 0.25;
severity1.Opacity = 0.25;
var image = (Image)sender;
image.Opacity = 1;
}
}
and xaml:
<StackLayout>
<Image x:Name="severity5" Source="severity_5.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</Image.GestureRecognizers>
</Image>
<Image x:Name="severity4" Source="severity_4.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</Image.GestureRecognizers>
</Image>
<Image x:Name="severity3" Source="severity_3.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</Image.GestureRecognizers>
</Image>
<Image x:Name="severity2" Source="severity_2.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</Image.GestureRecognizers>
</Image>
<Image x:Name="severity1" Source="severity_1.png" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="40">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnSeverityTapped" NumberOfTapsRequired="1"/>
</Image.GestureRecognizers>
</Image>
</StackLayout>