We Keep Coding

How to change background color of listview selected item in Xamarin Forms Cross Platform without a custom renderer

how can I change the selected color of a list view selected item in Xamarin Forms Cross Platform?
I was able to change it using the answer in this question How can I change background color of a ListView in Xaml?
but on first appear the selected item is with the default background color (Orange).
Any suggestions?
I wonder why in 2019 (nearly 2020) there isn't an out of the box way to change this basic and common property easly.
Thanks.

The below code works perfectly for me. However, it iterates the entire ItemsSource for resetting the background of the previously selected item. You can store it and reset it if you wish to optimize it. Hope this helps.
<ListView x:Name="contactList" ItemsSource="{Binding PlatformsList}" ItemTapped="contactList_ItemTapped"
VerticalOptions="CenterAndExpand" HorizontalOptions="FillAndExpand">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Label TextColor="Black" Margin="10,0" Text="{Binding PlatformName}" BackgroundColor="{Binding Background}" VerticalOptions="Center" />
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
private void contactList_ItemTapped(object sender, ItemTappedEventArgs e)
{
var selectedItem = e.Item as PlatformInfo;
selectedItem.ItemBackground = Color.Aqua;
foreach(var item in this.contactList.ItemsSource)
{
if (item != selectedItem)
(item as PlatformInfo).ItemBackground = Color.Transparent;
}
}

I chose to avoid using the ListViews's ItemSelected event or custom renderer approach and apply style changes in the code behind file. The Tapped gesture event and a list (SelectedItems) for tracking the views contained within the active list item, provides easy color style changes.
.xaml file
<ListView ItemsSource="{Binding ViewModelList}" SelectionMode="None">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Text="{Binding CNumber'}">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="Tapped_Command" CommandParameter="{Binding CNumber}" />
</Label.GestureRecognizers>
</Label>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding Brand}" TextColor="{StaticResource Blue}">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="Tapped_Command" CommandParameter="{Binding CNumber}" />
</Label.GestureRecognizers>
</Label>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
.xaml.cs code behind file
private List<View> SelectedItems { get; set; }
public MYListPage()
{
InitializeComponent();
BindingContext = new MyViewModel();
SelectedItems = new List<View>();
}
private async void Tapped_Command(object sender, EventArgs e)
{
var l = (Label)sender;
var cNumber= (((TappedEventArgs)e).Parameter) as string;
if (string.IsNullOrEmpty(contract))
await DisplayAlert("Error", "Could not load the information", "close");
else
{
if (SelectedItems.Count > 0)
{
foreach (var v in SelectedItems) //reset the styling to the original 'unselected' colors
{
if (v.GetType() == typeof(Grid))
((Grid) v).BackgroundColor = Color.Transparent;
else if(v.GetType() == typeof(Label))
((Label)v).TextColor = Color.Black;
}
SelectedItems.Clear();
}
var parent = (Grid)l.Parent;
parent.BackgroundColor = Color.FromHex("#E0E0E0"); //set the background color
SelectedItems.Add(parent);
foreach (var c in parent.Children) //option to set additional styling to the child elements
{
var child = (Label)c;
child.TextColor = Color.FromRgb(0, 123, 255);
SelectedItems.Add(child);
}
await Navigation.PushAsync(new MyDetailsPage(viewModel, cNumber));
}
}

How to set focus on Entry inside Listview? Xamarin Forms

I have a listview and each row contains a label and an entry. How can I set focus for the entry if a row was tapped. My listview is generated dynamically.
void selected(object sender, SelectedItemChangedEventArgs e)
{
if (e.SelectedItem == null)
{
return; //ItemSelected is called on deselection, which results in SelectedItem being set to null
}
TestReading item = (TestReading)e.SelectedItem;
//comment out if you want to keep selections
ListView lst = (ListView)sender;
lst.SelectedItem = null;
}
I want the soft keyboard to show up whenever user tap a particular row regardless of any position.

Use Tapped
<ListView x:Name="ItemsListView" SeparatorColor="LightGray" BackgroundColor="Green" RowHeight="60">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell Tapped="ViewCell_Tapped">
<StackLayout Padding="15, 5, 0, 0" Orientation="Horizontal" BackgroundColor="White">
<Entry x:Name="myEntry" HorizontalOptions="FillAndExpand"/>
<Label Text = "{Binding ItemText}" FontSize="20" TextColor="Black" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
in code behind
private void ViewCell_Tapped(object sender, EventArgs e)
{
ViewCell vs = (ViewCell)sender;
var entry = vs.FindByName<Entry>("myEntry");
entry?.Focus();
}

How to Move Button Beside Text Boxes in WPF using WrapPanel

I am new to WPF. I have a Button.I want to create Dynamic textBoxes.when ever I got the focus on dynamic textbox the button move to beside textbox. I dont know how to do this. please help me
<Grid Name="mymy" HorizontalAlignment="Left" Height="243" Grid.Column="0" Grid.Row="0" VerticalAlignment="Top" Width="263" Margin="462,105,0,0" Grid.RowSpan="2" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<WrapPanel Grid.Column="1" x:Name="abc" HorizontalAlignment="Left" Height="232" Margin="0,0,-250,-218" VerticalAlignment="Top" Width="262" Grid.Row="1"/>
</Grid>
<!--<DockPanel Name="mymy1" HorizontalAlignment="Left" Height="191" LastChildFill="True" Margin="424,94,0,0" VerticalAlignment="Top" Width="282" Grid.RowSpan="2"/>-->
.cs code
private void button_Click(object sender, RoutedEventArgs e)
{
txtSource = new TextBox();
txtSource.MinHeight = 15;
txtSource.Width = 100;
txtSource.Height = 25;
txtSource.Name = "txtSource";
//Binding txtBinding = new Binding("PurchaseOrder.PickupSrcCodeName"); /*txtBinding.Mode = BindingMode.OneWay;*/
//txtSource.SetBinding(TextBox.TextProperty, txtBinding);
ColumnDefinition colDef1;
colDef1 = new ColumnDefinition();
mymy.ColumnDefinitions.Add(colDef1);
RowDefinition rowDef1;
rowDef1 = new RowDefinition();
mymy.RowDefinitions.Add(rowDef1);
++count;
abc.Children.Add(txtSource);
Grid.SetColumn(txtSource, count);
Grid.SetRow(txtSource, 0);
txtSource.GotFocus += t_GotFocus;
txtSource.TextChanged += this.t_TextChanged;
}
private void t_TextChanged(object sender, RoutedEventArgs e)
{
button.Visibility = Visibility.Visible;
}
enter image description here

Welcome to SO.
Consider these two things:
It's extremely bad habit to change the layout of a grid at run time (and by layout I mean rows and columns)
Just the same way that you set your textboxes positions in your grid you can position your button within it as well. You just need to create the rows and columns required by it before head.
My opinion here is you should have a stack layout adding controls to it dynamically. That control then can be custom control consisting of a grid with a text box and a position for button (or maybe a button that can be hidden or visible with a property)
If you like my idea please see this to know how to create custom controls.

how to remove dynamically created Row in user control in WPF?

I have created an User control. I am creating dynamically this user control in a Page. I have a button in that control to remove the row which is created dynamically. I am unable to remove the entire Row.
This is my Xaml:
<Grid Name="grid_usercontrolTypeofFixture" >
<Grid.RowDefinitions >
<RowDefinition Height="20*"/>
<RowDefinition Height="35*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="35*" />
<ColumnDefinition Width="50*" />
<ColumnDefinition Width="15*" />
<ColumnDefinition Width="10*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Margin="10,5,5,5" Content="Select/Type Fixture Type:" />
<TextBox Grid.Row="0" Grid.Column="1" Margin="10,5,5,5" Text="" Name="txtAuto"/>
<TextBox Grid.Row="0" Grid.Column="2" Margin="10,5,5,5" Text="" Name="txt_percentage"/>
<Button Grid.Row="0" Grid.Column="3" Margin="10,5,5,5" x:Name="btn_removeRow" Content="" Click="btn_removeRow_Click">
<Button.Background>
<ImageBrush ImageSource="/Assets/Knob Cancel.png"></ImageBrush>
</Button.Background>
</Button>
</Grid>
This is My Code Behind:
public int count = 1;
private void btn_addnew_Click(object sender, RoutedEventArgs e)
{
var myControl = new UserControlTypeofFixture() { Name = "TypeofFixture" };
grid_typeFixture.RowDefinitions.Add(new RowDefinition());
Grid.SetRow(myControl, count);
grid_typeFixture.Margin = new Thickness(10, 10, 10, 10);
grid_typeFixture.Children.Add(myControl);
count++;
}
private void btn_removeRow_Click(object sender, RoutedEventArgs e)
{
???
}
I have some other code to remove the selected row. but its not working. How can i remove entire row?

This is how you can remove your usercontrol and rowdefinition
private void btn_removeRow_Click(object sender, RoutedEventArgs e)
{
var myControl = sender as Button;
int rowindex = (int)myControl.GetValue(Grid.RowProperty);
foreach (UIElement control in grid_typeFixture.Children)
{
var usercontrol = control as UserControlTypeofFixture;
if (usercontrol != null)
{
int childrowindex = (int)usercontrol.GetValue(Grid.RowProperty);
if (childrowindex == rowindex)
{
grid_typeFixture.Children.Remove(control);
grid_typeFixture.RowDefinitions.RemoveAt(childrowindex);
break;
}
}
}
}

Ok, then try the alternative solution I've mentioned, i.e. set the particular RowDefinition Height to 0: pertinent to your case it should be like the following:
private void btn_removeRow_Click(object sender, RoutedEventArgs e)
{
grid_typeFixture.RowDefinitions[2].Height = new GridLength(0);
}

Pivot item headers like instagram in windows phone 8

I need your ideas how can i put Segoe UI Font or icons to Pivot Headers.
I started a new project and put basic Pivot on my XAML, if you ask more and more code, that's all.
This is the app link that i want to know how can they put items as icons rather than texts.
http://instagram.com/
i need sample code rather than fairy tale or success stories.
<phone:PivotItem CacheMode="{x:Null}" FontFamily="Segoe UI Symbol" Header="feed" >

As it turns out there is a great article on the Nokia Developer Wiki for doing just that.
The gist of it is to not have a Header set for the PivotItem and instead to display a ListBox at the top of the page. You then link the ListBox SelectedIndex to the Pivot SelectedIndex.
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<ListBox SelectedIndex="{Binding SelectedIndex, ElementName=ContentPivot, Mode=TwoWay}">
<!-- Items -->
</ListBox>
<phone:Pivot x:Name="ContentPivot">
<!-- Items -->
</phone:Pivot>
</Grid>

This is the actual answer in MSDN forums.
..and this is how it looks on the phone's screen.
Simply use the event handlers. Tap of Image and SelectionChanged of Pivot.
Here is the xaml I used:
<Grid x:Name="LayoutRoot" Background="#2b5a83">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition/>
</Grid.RowDefinitions>
<Grid VerticalAlignment="Top" Height="82"
Background="#2b5a83" Canvas.ZIndex="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image x:Name="icon0" Grid.Column="0"
Source="/Assets/ApplicationIcon.png"
Opacity="0.5" Tap="icon0_Tap"/>
<Image x:Name="icon1" Grid.Column="1"
Source="/Assets/ApplicationIcon.png"
Opacity="0.5" Tap="icon1_Tap" />
</Grid>
<!--Pivot Control-->
<phone:Pivot Grid.Row="1" x:Name="MainPivot"
Foreground="White" Background="#2b5a83"
SelectionChanged="Pivot_SelectionChanged">
<!--Pivot item one-->
<phone:PivotItem>
<TextBlock>
Deneme
</TextBlock>
</phone:PivotItem>
<!--Pivot item two-->
<phone:PivotItem>
<TextBlock>
Deneme 2
</TextBlock>
</phone:PivotItem>
</phone:Pivot>
</Grid>
... and the CSharp code-behind as follows:
private void Pivot_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
switch (MainPivot.SelectedIndex)
{
case 0:
Select0();
break;
case 1:
Select1();
break;
default:
MessageBox.Show("Add another case and write it's new method, " + Environment.NewLine +
"Also bind the `Tap` event of another image to a new handler calling this newly created method.");
break;
}
}
private void Icon1_Tap(object sender, GestureEventArgs e)
{
Select1();
}
private void Select0()
{
icon0.Opacity = 1.0;
icon1.Opacity = 0.5;
MainPivot.SelectedIndex = 0;
}
private void Select1()
{
icon1.Opacity = 1.0;
icon0.Opacity = 0.5;
MainPivot.SelectedIndex = 1;
}
private void icon0_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
Select0();
}
private void icon1_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
Select1();
}
Try it! =) ...and let me know of the outcome:)