I want to have blank value in my picker when I start the app(before I make selection).
Currently when I launch my app picker shows Value1 in the box. Here is my List that I bind with Picker:
private List<string> _PickerValueBind = new List<string>() {"Value1", "Value2"};
And the xaml:
<Picker ItemsSource="{Binding PickerValueBind}" HorizontalOptions="FillAndExpand" IsEnabled="{Binding PickerEnabledBind}" SelectedIndex="{Binding PickerIndexBind}">
<Picker.Behaviors>
<prism:EventToCommandBehavior
EventName="SelectedIndexChanged"
Command="{Binding IndexChangedBind}" />
</Picker.Behaviors>
</Picker>
I tried using Picker.Title but it didn't work as desired. Also tried adding empty item as first item but in the end I don't want user to have option to pick empty value.
Set value of PickerIndexBind = -1 in viewmodel
Related
We are developing a small application, we have created dashboard using custom render but I can’t change label text color. it is default showing like lable text color white, list view background color It will come via api so that if it is coming white background then label text color is not able to see. Here I have attached the code below. Give me suggestions to resolve this issue
Menucontrol custom render
public static readonly BindableProperty ItemsSourceProperty =
BindableProperty.Create<MenuControl, IEnumerable>(
view => view.ItemsSource,
null,
BindingMode.TwoWay,
null,
propertyChanged: (bindableObject, oldValue, newValue) =>
{
((MenuControl)bindableObject).ItemsSourceChanged(bindableObject, oldValue, newValue);
}
);
public IEnumerable ItemsSource
{
get
{
return (IEnumerable)GetValue(ItemsSourceProperty);
}
set
{
SetValue(ItemsSourceProperty, value);
}
}
Add a Data Trigger
<ListView>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout BackgroundColor={Binding BGColor}>
<Label TextColor="White">
<Label.Triggers>
<!--(or Value ="White" depends on binding value Xamarin.Color or string) -->
<DataTrigger TargetType="Label" Binding={Binding BGColor} Value="#FFFFFF">
<Setter Property="TextColor" Value="Red"/>
<!--(or your color) -->
</DataTrigger>
</Label.Triggers>
</Label>
</StackLayout>
<ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
So when your BGColor(or any property you bind to color) property is something you think that can clash(for e.g. white) with your text color(e.g. also white) use data triggers. You can create multiple but if there are more than 3 or 4 I would advise you to use converters in that case.
I'm trying to create a XAML UI based on the condition.
<StackLayout Orientation="Horizontal">
<!--IF WorkEmailAddress != NULL && WorkEmailAddrress != ""-->
<!-- BEGIN IF -->
<Label Text="{Binding WorkEmailAddress}" Style="{StaticResource labelListItem}"></Label>
<Image HeightRequest="16" HorizontalOptions="End" VerticalOptions="Center" Source="arrow.png" Margin="0,0,15,0"></Image>
<!-- END IF -->
<!-- ELSE -->
<Label Text="Add new email" Style="{StaticResource labelLinkItem}">
</StackLayout>
Could one please let me know how to add a IF ELSE condition with in the XAML to dynamically create a UI based on the value returned from the backend.
You can't do this completely in XAML. Probably the best way to go is to add a bool property to your view model named HasWorkEmailAddress (I'm assuming you have one, and that's where WorkEmailAddress lives) which returns true if there's a non-null, non-empty value for WorkEmailAddress.
You can then bind the first label and Image's IsVisible property to this bool.
You can also create an InverseBooleanConverter, which will implement IValueConverter. The Convert method will simply take a bool and negate it, and return that value. Bind your second labels' IsVisible to the same bool, but specify the InverseBooleanConverter as the binding's Converter. It will then show only if the HasWorkEmailAddress returns false. The labels binding will look like this:
<Label IsVisible="{Binding HasWorkEmailAddress, Converter={StaticResource InverseBooleanConverter}}" />
If you don't want to write your own converter, one exists in the FreshEssentials Nuget package.
One last thing; if its possible for WorkEmailAddress to change while the page is being shown, you'll need to make sure you raise a PropertyChanged event for the HasWorkEmailAddress property, or your view will not change appropriately.
I have a ListView bind to list of BitmapImage.
I want to get the Index of current image in focus when I scroll thru this list.
But, I notice that ItemAppearing property is not there in UWP but it is there in Xamarin Forms.
How can I get the index of the current item in view?
Thanks!
<ScrollViewer Grid.Row="0" ZoomMode="{x:Bind ZoomMode, Mode=OneWay}" HorizontalScrollMode="Enabled" HorizontalScrollBarVisibility="Auto">
<ListView HorizontalAlignment="Center" ItemsSource="{x:Bind ImagePages, Mode=OneWay}">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="BitmapImage">
<Image Source="{x:Bind }" Margin="0 2" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListView>
</ScrollViewer>
For starters, the ItemAppearing property is not the behavior you are looking for. The ItemAppearing event for the ListView in Xamarin Forms is fired when the list item is rendered. For a small list this event will be fired for all items immediately. The equivalent event in UWP is ListView.ChoosingItemContainer event which like the ItemAppearing event, unless the ListView is virtualized is fired for all items in the list. Even for a large virtualized list, it is fired for several pages of items.
This is not what you want. As I understand it, you want to know the image that is visible at the top of the list view when the list is scrolled. Here is how to do that.
First of all. Get rid of the ScrollViewer. The ListView already has a ScrollViewer inside of it.
<ListView x:Name="listViewImage" Grid.Row="0" HorizontalAlignment="Center" ItemsSource="{x:Bind ImagePages, Mode=OneWay}"
Loaded="listViewImage_Loaded">
<ItemsControl.ItemTemplate>
<DataTemplate x:DataType="BitmapImage">
<Image Source="{x:Bind }" Margin="0 2"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ListView>
Note that I have named the ListView and I have added a Loaded event handler. In this handler, find the ScrollViewer inside the ListView and attach a handler to the ViewChanged event.
private void listViewImage_Loaded(object sender, RoutedEventArgs e)
{
Border b = VisualTreeHelper.GetChild(listViewImage, 0) as Border;
ScrollViewer sv = b.Child as ScrollViewer;
sv.ViewChanged += Sv_ViewChanged;
}
In the view changed handler, find the first visible ListViewItem and get its index in the collection. This is what you want.
private void Sv_ViewChanged(object sender, ScrollViewerViewChangedEventArgs e)
{
ScrollViewer sv = sender as ScrollViewer;
GeneralTransform gt = sv.TransformToVisual(this);
Point p = gt.TransformPoint(new Point(0, 0));
List<UIElement> list = new List<UIElement>(VisualTreeHelper.FindElementsInHostCoordinates(p, sv));
ListViewItem item = list.OfType<ListViewItem>().FirstOrDefault();
if(item != null)
{
int index = listViewImage.IndexFromContainer(item);
Debug.WriteLine("Visible item at top of list is " + index);
}
}
I have tried to detect the scrolling direction of the list view. My requirement is need to implement different functionality while list view scrolling up and scrolling down. Please suggest any idea for detecting list view scrolling direction. I have tried below syntax in my list view.
Sample code:
<StackLayout>
<Label x:Name="Direction" />
<ListView ItemsSource="{Binding Items}" HasUnevenRows = "true" ItemAppearing="Handle_ItemAppearing" IsPullToRefreshEnabled = "true">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout>
<Label Text = "{Binding}" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
I don't think you can do it by default, you can only act on a item that is appearing or disappearing. So, you either need to work with that by creating some code which gets the index of (dis)appearing items and and see if the indexes are getting higher or lower to determine whether someone is scrolling up or down. Or you need to hook up a custom renderer, but I'm not sure the native controls have anything to detect this either.
I've whipped up a very basic example for you, you can find the full code here.
Basically hook into the event available, keep track of the last index in a class variable and compare it to the current index of the item that is appearing.
private void Handle_ItemAppearing (object sender, Xamarin.Forms.ItemVisibilityEventArgs e)
{
var currentIdx = Items.IndexOf ((string)e.Item);
if (currentIdx > _lastItemAppearedIdx)
Direction.Text = "Up";
else
Direction.Text = "Down";
_lastItemAppearedIdx = Items.IndexOf ((string)e.Item);
}
In this code I simply show it in a Label, but of course you can create some enum to return or fire an event or something to make the code some more reusable. Here is the code in action:
Recently came through this problem and fixed it this way:
<StackLayout>
<Label x:Name="Direction" />
<ListView ItemsSource="{Binding Items}" HasUnevenRows = "true" ItemAppearing="Handle_ItemAppearing" ItemDisappearing="Handle_ItemDisappearing" IsPullToRefreshEnabled = "true">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout>
<Label Text = "{Binding}" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
string ScrollingDirection;
int visibleTabIndex;
int disappearingTabIndex;
public async void Handle_ItemAppearing(object sender, ItemVisibilityEventArgs e)
{
var visibleTab = e.Item;
visibleTabIndex = MyItemsList.IndexOf(visibleTab);
if (disappearingTabIndex > visibleTabIndex) ScrollingDirection = "DOWN";
else ScrollingDirection = "UP";
}
public async void Handle_ItemDisappearing(object sender, ItemVisibilityEventArgs e)
{
var invisibleTab = e.Item as TicketsList;
disappearingTabIndex = tvm.Tickets.IndexOf(invisibleTab);
}
Basic problem: How do I bind a textbox to the selected item of a combobox who's itemsource is the result of a LINQ query on a WCF RIA Services Domain context.
Additional requirement: When the selected item is changed the binding should update.
Additional requirement: The binding should be two way.
My solution so far:
After the user clicks to create a new item, new items are created and added to the object set but not persisted yet (one for each language). After that this code runs. The combobox is supposed to allow the user to select one of the created items, which is displayed as it's corresponding language. The bound textboxes should allow the user to edit the item.
Code behind:
//Setup the combobox
LanguageComboBox.ItemsSource = dc.GeneralStatistics.Where(g => g.RelatedResourceId.Equals(guid));
LanguageComboBox.DisplayMemberPath = "Language.LanguageName";
LanguageComboBox.SelectedItem = dc.GeneralStatistics.First(g => g.Language.LanguageName.Equals("English"));
//Setup the textboxes
this.StatisticsText.DataContext = (LanguageComboBox.SelectedItem as GeneralStatistics).Text;
this.ShortDescriptionText.DataContext = (LanguageComboBox.SelectedItem as GeneralStatistics).ShortDescription;
XAML CODE:
<ComboBox x:Name="LanguageComboBox" />
<TextBox x:Name="ShortDescriptionText" Text="{Binding}" />
<TextBox x:Name="StatisticsText" Text="{Binding}" />
The problem with my solution:
It does not work, because when I change the selection in the combobox the textboxes do not update. I could implement the selection changed event handler and manually update the textboxes, but that would defeat the purpose of binding the textboxes. What is the best practice here?
You can simplify the code by doing the following.
Code behind:
LanguageComboBox.DataContext = dc.GeneralStatistics.Where(g => g.RelatedResourceId.Equals(guid));
XAML:
<ComboBox x:Name="LanguageComboBox" />
<TextBox x:Name="ShortDescriptionText" Text="{Binding ElementName=LanguageComboBox, Path=SelectedItem.ShortDescription}" />
<TextBox x:Name="StatisticsText" Text="{Binding ElementName=LanguageComboBox, Path=SelectedItem.LongDescription}" />