Update a ViewCell in a TableView with UnevenRows doesn´t work correctly Xamarin.Forms - c#

Fill the TableView with so many ViewCells, so you must scroll the page to see the last ViewCell.
If you then update the last ViewCell (change the text of the label) over the Tapped-Event, the label.Text would not be updated..
PS: The ForceUpdateSize is no way the fix the solution, because on iOS the app freeze at the sixth time.
<TableView Intent="Settings" HasUnevenRows="True">
<TableRoot>
<TableSection>
<ViewCell x:Name="DefaultViewCell" Tapped="ItemTapped">
<StackLayout>
<Label x:Name="DefaultLabel" />
</StackLayout>
</ViewCell>
<!--.....-->
</TableSection>
</TableRoot>
</TableView>

I have tested your sample code , it actually happened the phenomenon your describe. Although it not happens in Android ,however it occurs in IOS .Maybe there are something difference about Label between IOS anf Android.
Finally , I found a solution in IOS. You can set a default Text Value to Label ,then Tapped method can work .
As Follow:
<TableView Intent="Settings" HasUnevenRows="True" BackgroundColor="Accent" >
<TableRoot>
<TableSection>
<ViewCell x:Name="DefaultViewCell" Tapped="DefaultViewCell_Tapped">
<StackLayout>
<Label x:Name="DefaultLabel" Text="Default Text "/>
</StackLayout>
</ViewCell>
...
</TableSection>
</TableRoot>
</TableView>

Related

Xamarin.Forms CollectionView and IsVisible Strange Behaviour in version 5

I have noticed something odd with the latest version of Xamarin.Forms (5.0.02244) and building for iOS 15. The below does not affect the Android version of this application, building with the latest XF against Android works fine with this code. This problem was not here with XF < v5 or iOS 14.
Has something changed with the IsVisible logic between Xamarin.Forms v4.x and v5? Again, the same code works fine downgrading to XF 4. But with the latest XCode version and iOS 15 I need to now use XF v5.
Or have I been doing this wrong and it just happened to work with XF v4 (and still works on Android with XF v5)
Minimal example:
Below is the XAML for a search box and results view. The results view populates with Items that contain the text being typed in the search box (ItemsList). The height of this is also set by searchZoneHeight. This all works fine on Android and iOS XF < v5.
isSearchResultVisible is set when the user taps an item, tapping the item sets the search bar text to be that item and then hides the search results.
What I am seeing in iOS with XF v5 is that the CollectionView remains visible as a white box. The size of the white box is the height of one search result. So the height of the view is correctly set but the request for isSearchResultVisible = false; isn't being respected. There are no error outputs in the console.
If I bind the request to make something invisible to another UI component on tap it works. Seems only the RefreshView/CollectionView are ignoring it.
Any suggestions are much appreciated thanks,
XAML
<SearchBar Text="{Binding searchText}" Placeholder="Type to search" IsSpellCheckEnabled="False" />
<RefreshView x:DataType="local:ViewModel" IsVisible="{Binding isSearchResultVisible, Mode=TwoWay}" Command="{Binding searchItems}" >
<CollectionView HeightRequest="{Binding searchZoneHeight}" x:Name="ItemsList"
ItemsSource="{Binding searchResultItems}"
SelectionMode="None" >
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Padding="10" x:DataType="model:Item" >
<Label Text="{Binding Text}"
Style="{DynamicResource ListItemTextStyle}"
FontSize="16" />
<StackLayout.GestureRecognizers>
<TapGestureRecognizer
NumberOfTapsRequired="1"
Command="{Binding Source={RelativeSource AncestorType={x:Type local:ViewModel}}, Path=ItemTapped}"
CommandParameter="{Binding .}">
</TapGestureRecognizer>
</StackLayout.GestureRecognizers>
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</RefreshView>
View Model
async void OnItemSelected(Item item)
{
// This fires so I know the tap event works
Debug.WriteLine("Search result was tapped " + item.Text);
// Below line does set the search text correctly (iOS and Android)
searchText = item.Text;
// Below doesn't work on iOS
isSearchResultVisible = false;
OnPropertyChanged(nameof(isSearchResultVisible));
// Below line also does not work on iOS
//OnPropertyChanged("isSearchResultVisible");
}

ActivityIndicator not showing in XAML or CodeBehind

I have a weird situation on my Xamarin.Forms app. I´m trying to show an ActivityIndicator, but it is not showing in any condition. I´ve set all conditions on XAML and then I tried on code behind. But I could not get it to work. This is the code:
<StackLayout HorizontalOptions="Center"
VerticalOptions="Center">
<ActivityIndicator x:Name="actIndicator"
Color="Blue"
IsVisible="True"
IsRunning="True"/>
<Label x:Name="lblCargando"
Text="Cargando..." />
<Label x:Name="lblStatus"/>
<Button x:Name="btnCerrar"
Text="Cerrar"
IsVisible="False"
Clicked="Cerrar_Clicked"/>
</StackLayout>
Is there something missing?.
Thanks.
Finally, it seems that there was an issue with the emulator that was executing an old version of code.
I deleted the emulator and re create it and get rid of the problem.

How to partially cut ViewCell separator line in Xamarin Forms?

I am using ViewCell to create rows in my table settings page. I have a setting to select a Light or Dark theme.
<ViewCell Height="50">
<StackLayout x:Name="darkTheme" VerticalOptions="FillAndExpand" Padding="20,0,20,0">
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Dark" XAlign="Center" FontSize="15"/>
<Label x:Name="darkThemeCheckmark" Text="{x:Static local:FontAwesome.FACheck}" FontFamily="FontAwesome" XAlign="Center" IsVisible="false" FontSize="12" HorizontalOptions="EndAndExpand"/
</StackLayout>
</StackLayout>
</ViewCell>
<ViewCell Height="50">
<StackLayout x:Name="lightTheme" VerticalOptions="FillAndExpand" Padding="20,0,20,0">
<StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand">
<Label Text="Light" XAlign="Center" FontSize="15"/>
<Label x:Name="lightThemeCheckmark" Text="{x:Static local:FontAwesome.FACheck}" FontFamily="FontAwesome" XAlign="Center" IsVisible="false" FontSize="12"/>
</StackLayout>
</StackLayout>
</ViewCell>
Whenever I switch from dark to light theme, there is faint light line on the left side between my rows that I can't seem to get rid of. Please refer to the images below:
In my renderer I have set the following:
tableView.LayoutMargins = new UIEdgeInsets() { Left = 20 };
cell.SeparatorInset = new UIEdgeInsets() { Left = 20 };
cell.LayoutMargins = new UIEdgeInsets() { Left = 20 };
Anyone knows how to get rid of this line?
Edit:
I wanted it to look like below:
I am novice to xamarin but, According to this post you need to do this on the UITableView and on your UITableViewCell subclasses.
I hope this will help you. :)
Apologies in advance incase you have already considered this but I believe what you're looking for is 'TableView.SeparatorInset' this would apply to your renderer rather than the xaml your using in your PCL. You can find the documentation around styling the tableviews at this link.
E.G.
TableView.SeparatorInset.InsetRect(new CGRect(4, 4, 150, 2));
Moving the inset of the seperator will get around the problem I saw you mention in the comments of the other answer about the whole table shifting. Please let me know if you've tried this already, it's the simplest solution but there are other options available to you. (They just aren't as nice).
Edit: Example of a way of achieving your goals by creating your own seperators, not my favourite but would also resolve the issue you've highlighted as you'd have complete control over the styling of a seperator. Refer to this Link

Activity Indicator is not displaying in middile - XamarinForms WinPhone81

I'm experiencing a strange behaviour of ActivityIndicator in my XamarinForms project. The indicator loads up perfectly in WinPhone81 but not in the middle of the layout for the first time, but it works perfectly from the second time to infinity. Below is the code I used:
In XAML:
<StackLayout x:Name="blueBar" Padding ="0,0,0,0" Orientation ="Vertical"
HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" >
</StackLayout>
In CS:
ActivityIndicator loading = new ActivityIndicator();
blueBar.Children.Add(loading);
loading.IsRunning = true;
//some functions
blueBar.Children.Remove(loading);
Does any knows why its behaving like this ?!
Any suggestions/guide/help will be appreciated..!!
Thanks in advance.
Note: The ActivityIndicator works well and fine in Droid & iOS projects.
Output: as I'm experiencing
1.First time execution of the page:
2.Second time execution of the same page:
Output: as per -Chandresh Khambhayata
Thanks for helping me out guys...
I Finally figured out an answer for my question...
Here is the working code of mine (on all the three platforms).
XAML :
<StackLayout x:Name="blueBar" Padding="0,0,0,0" Orientation="Vertical" VerticalOptions="FillAndExpand" >
<ActivityIndicator x:Name="loading" IsRunning="true"></ActivityIndicator>
</StackLayout>
CS :
somebtn.Clicked += async(sender,e) => {
loading.IsVisible = true;
//some await functions like api call or something
loading.IsVisible = false;
}
The actual problem is., the Indicator is not allocated by InitializeComponent() before., so when I click any of the button for the first time., Indicator displays to the left of the layout.
But., now the Indicator is initialized by InitializeComponent()., and so the indicator is displaying in the middle for the first click itself...
Note : This problem only occured on windowsphone only not on ios and android projects.
Now the updated code works well and good on all the three platforms.
if you want to display ActivityIndicator in center of the screen then you most have to apply HorizontalOptions="Center" and VerticalOptions="Center"
I am using the below XML code and it's working perfect for me.
<StackLayout VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
<ActivityIndicator Color="White" HorizontalOptions="Center" VerticalOptions="Center" />
<Label Grid.Row="1" x:Name="LabelLoading" HorizontalOptions="Center" TextColor="White" Text="Loading..." FontFamily="Droid Sans Mono" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" />
</StackLayout>
Here is programmatically setting activity indicator.
ActivityIndicator activityIndecator = new ActivityIndicator();
activityIndecator.Color = Color.White;
activityIndecator.HorizontalOptions = LayoutOptions.Center;
activityIndecator.VerticalOptions = LayoutOptions.Center;
blueBar.Children.Remove(activityIndecator);
Thank You.
it seems like you need to put your StackLayout inside a AbsoluteLayout first in order for you to adjust the ActivityIndicator to the middle.
This should link help you.
Haven't tried this yet, but it looks like you need to do a lot of stuff to achieve it.
Hope it helps!

Xamarin forms change SwichCell Text Color

Is it possible to change the text color of xamarins SwichCell ?
At the moment the text in my SwichCell is colored gray, and I want to change it to black.
My xaml looks like this:
..
<TableView Intent="Data" >
<TableRoot>;
<TableSection>
<SwitchCell Text="Allow Push Notifications"/>
</TableSection>
<TableSection>
<ViewCell>
<ViewCell.View>
<Button Grid.Column="1" Text="Log Out" Clicked="LogOutButtonClick" Margin="-20,-20,-20,-20"/>
</ViewCell.View>
</ViewCell>
</TableSection>
<TableSection>
<TextCell Text="Android Version 1.2.1" TextColor="Black"/>
</TableSection>
</TableRoot>
</TableView>
The only thing regarding this I found here but the example is only for IOS and the other provided solutions uses TextCell and Swich combination, which does not fit my scenario (I think)
Someone has linked a stackoverflow answer regarding Swich here. But it does not work for my situacion since I'm using SwichCell and it does not have the properties that are listed in that answer(also it only has an android version)
If the SwitchCell doesn't expose a BackgroundColor Property, you can just wrap the Switch Control in its own ViewCell.
Can't Confirm the syntax, but something like this:
<ViewCell>
<StackLayout>
<Switch BackgroundColor="Black"/>
</StackLayout>
</ViewCell>

Categories