andreimisiukevich / expandableview Goto Github PK
View Code? Open in Web Editor NEWExpandable view for Xamarin.Forms
License: MIT License
Expandable view for Xamarin.Forms
License: MIT License
<CollectionView
ItemsSource="{Binding Items}"
VerticalOptions="StartAndExpand"
ItemSizingStrategy="MeasureAllItems">
<CollectionView.ItemsLayout>
<LinearItemsLayout
Orientation="Vertical"
ItemSpacing="0" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
<expander:ExpandableView StateChanged="ExpandableViewStatusChanged">
<expander:ExpandableView.PrimaryView>
<Grid
RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition
Height="Auto" />
<RowDefinition
Height="40" />
<RowDefinition
Height="Auto" />
</Grid.RowDefinitions>
<BoxView
HeightRequest="1"
BackgroundColor="Gray"
Grid.Row="0" />
<StackLayout
x:Name="sl"
Spacing="0"
Orientation="Horizontal"
Grid.Row="1">
<Label
Margin="20,0,0,0"
x:Name="plusMinus"
Text="+"
VerticalTextAlignment="Center" />
<Label
Text="{Binding Title}"
Margin="10,0,0,0"
TextColor="Green"
VerticalOptions="Center"
VerticalTextAlignment="Center"
HorizontalOptions="Start" />
</StackLayout>
<BoxView
HeightRequest="1"
BackgroundColor="Gray"
Grid.Row="2" />
</Grid>
</expander:ExpandableView.PrimaryView>
<expander:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<Label
Padding="30,10"
Text="{Binding Detail}"
VerticalOptions="Start"
VerticalTextAlignment="Center" />
</DataTemplate>
</expander:ExpandableView.SecondaryViewTemplate>
</expander:ExpandableView>
</DataTemplate>
private void ExpandableViewStatusChanged(object sender, StatusChangedEventArgs args)
{
if (sender is ExpandableView expander)
{
if (expander.PrimaryView is Grid grid)
{
if (grid.FindByName("sl") is StackLayout titleStackLayout)
{
if (titleStackLayout.Children[0] is Label icon && titleStackLayout.Children[1] is Label titleText)
{
if (args.Status == ExpandStatus.Expanding)
{
Device.BeginInvokeOnMainThread(() => {
titleStackLayout.BackgroundColor = Color.Green;
icon.Text = "-";
icon.TextColor = Color.White;
titleText.TextColor = Color.White;
});
}
else if (args.Status == ExpandStatus.Collapsing)
{
Device.BeginInvokeOnMainThread(() => {
titleStackLayout.BackgroundColor = Color.White;
icon.Text = "+";
icon.TextColor = Color.Green;
titleText.TextColor = Color.Green;
});
}
}
}
}
}
}
Tried calling expander.ForceUpdateSize() and (expander.PrimaryView as Grid).ForceLayout() but dint work as expected.
On android it is fine.
It cannot define x:Name in ExpandableView.SecondaryViewTemplate.
for example;
<StackLayout>
<expandable:ExpandableView>
<expandable:ExpandableView.PrimaryView>
<Label x:Name="UseableXName" Text="PrimaryText" />
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<Label x:Name="UselessXName" Text="SecondaryText" />
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
</StackLayout>
From the code above, I cannot use "UselessXName" in cs file. I'm not sure why.
Hello,
I am using your control in a personalized way:
<expandable:ExpandableView ExpandAnimationLength="100">
<expandable:ExpandableView.PrimaryView>
<Label Text="Example" />
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<controls:StackLayoutItemsView ItemsSource="{Binding Items}" />
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
StackLayoutItemsView is ContenView with StackLayout BindableLayout.
If in the before code remove the control (ContenView) and I put only StackLayout BindableLayout not there is bottom space.
The same control, but:
Spy names on WPF https://www.wpf-tutorial.com/misc-controls/the-expander-control/
From the secondary view the user can select a record and once they have completed entering the data and click save I want to;
Is it possible to programmatically select the next item in the view?
I am having a strange interaction of items in the Secondary view when expanding or unexpanding.
The issue is that, items in the view are getting centered in the view in an unnatural way.
See the video for more details.
https://streamable.com/17lpu
Hello Andrei:
In the ManyPageView I noticed the ScrollView was not showing. Do you have any idea as to why that would be?
public ManyViewsPage()
{
var mainStack = new StackLayout
{
Spacing = 15
};
for (int i = 0; i < 15; ++i)
{
mainStack.Children.Add(CreateExpandable(i));
}
BackgroundColor = Color.Olive;
Content = new ScrollView
{
Padding = new Thickness(20, Device.RuntimePlatform == Device.iOS ? 20 : 0, 20, 0),
Content = mainStack
};
}
Hello! Thank you for such usefull plugin, could you please tell is there some API to collapse/expand view programmatically?
This might be a bug issue (again have attached GIF of issue in action). Basically issue seems to occur when ExpandableView Item in ListView is the last item (scrolling down the page to that item is the only way to replicate as well) and when expanding does not immediately allow user to scroll down further to reveal the SecondaryView, rather what is required is to scroll up the page a certain amount and then down a few times before it expands and reveals the SecondaryView.
You can see in the GIF below that I attempt to scroll down to show the collapsed SecondaryView but that doesnt work initially without scrolling up and down a few times.
ExpandableView: 1.0.9,
Xamarin Forms: 4.0.0.425677
Also I am using the new Xamarin.Forms.Visual.Material: 4.0.0.425677
Android Device is 5.1.1 (Galaxy Tab A 7.0 SM-T280),
I also have Target Android Version 9.0 (API Level 28) and minimum android version 5.0 (API Level 21)
My use case might be niche, I'm not sure. I only have one view I need to expand / collapse... except it's at the end of the ContentPage. As a result, when I select expand... the animation happens but is not in the user's viewport.
I solved this for myself by importing the ExpandableView directly into my project and adding another DependencyProperty called ContainingScrollViewer. If the user has set that, I scroll to the secondary view's start position in InvokeAnimation if the y + height of the secondary view is outside of the scrollviewer's viewport. After the scrollto, I RaiseStatusChanged and then return.
I'm not sure if this is a good solution for everybody.
Hi I just tried this out and experimenting this .
But i can't figure out a way to contract once a new item is selected.
My expandableView is inside a stacklayout with bindablelayout enabled
and tried to change the value of the IsExpanded bindable property through command in a viewmodel
Reproduction :
On Sample App, try this code in Arrow View
<expandable:ExpandableView x:Name="expandableView" BackgroundColor="Red"
TouchHandlerView="{x:Reference arrow}"
ExpandAnimationLength="100">
<expandable:ExpandableView.PrimaryView>
<StackLayout Orientation="Horizontal">
<Label Text="Expandable view" FontSize="30" VerticalTextAlignment="Center"/>
<Image x:Name="arrow" Source="arrow_drop_down.png" HeightRequest="60" WidthRequest="60" HorizontalOptions="EndAndExpand"/>
</StackLayout>
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<StackLayout Padding="5">
<Label Text="Item" FontSize="Large"/>
<Label Text="Item" FontSize="Large"/>
<Label Text="Item" FontSize="Large"/>
<Label Text="Item" FontSize="Large"/>
<Label Text="Item" FontSize="Large"/>
</StackLayout>
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
Or you can manually add BackgroundColor to ExpandableView and padding on SecondaryViewTemplate Layout
You'll see the bottom padding is growing. Not tested on ios
Now i want do some customized layout or some animation in your control but it's must use SecondaryViewTemplate.
Android ONLY issue I am facing:
I've noticed what I think might be an issue/bug with the plugin. My setup is I have your component inside a ListView as the viewcell, and when I scroll down the screen (I do note that only scrolling down a little first and then expanding causes issues) and expand and collapse a row unfortunately it just makes the content invisible rather then collapsing the SecondaryView and leaves a large empty space where the SecondaryView was (see the GIF below):
I'm using:
ExpandableView: 1.0.9,
Xamarin Forms: 4.0.0.425677
Also I am using the new Xamarin.Forms.Visual.Material: 4.0.0.425677
Android Device is 5.1.1 (Galaxy Tab A 7.0 SM-T280),
I also have Target Android Version 9.0 (API Level 28) and minimum android version 5.0 (API Level 21)
You provide a sample in this repo but don't using bindable items from xaml. Could you give us this sample? Thanks
Hi @AndreiMisiukevich could you check with this scenario? I need to click it multiple times until the webview show the text.. Thanks :)
<Expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<WebView>
<WebView.Source>
<HtmlWebViewSource Html="qwertyuiopasdfghjklzxcvbnm"/>
</WebView.Source>
</WebView>
</DataTemplate>
</Expandable:ExpandableView.SecondaryViewTemplate>
Hello Andrei:
I was trying to use as ListView replacement. The Control does not have ItemsSource as collection binding exposed entry point. In the example you just programmatically add Collection Items to the view. Is there an example floating around that binds in xaml to a Collection?
Thanks for all your hard work.
Kind Regards,
Mark Wardell
Please can you expose these 2 events in the xaml as they would help me change visualelements based upon the status of the expander.
I know there is an IsExpanded bool, but is there anyway to send events when this property changes?
Thank you in advance
I implement many expandable view in one form. When click the expand arrow of expandable view, the error of "NaN is not valid for height in IOS" will show and the app crash. It is random pattern for the error, sometime will trigger the error when click expandable view "A", sometime will trigger the error when click expandable view "B"...
Hello Andrei:
I have my application proven using ExpandableView. It is not, however working in true MVVM fashion. I fail/lockup when I attempt to attach a tapGesture to a Label inside the ExpandableView. I realize you have a sample AttachTapGestureToCustomViewPage. It never actually attaches a TapGesture... :)
I have learned in my MVVM framework how to attach to expanding/collapsing view and getting the BindingContext and casting to VM type. then operating on my ViewModel in that manner from View. my group of devs wants pure mvvm so this won't work for us.
Previously I had attempted attaching a gesture to an item inside the Expandable. primary view.... no luck. the system locked up.
here are my Questions related to achieving my goal.:
Can I turn touch handling off (IsTouchToExpandEnabled) and then safely without locking system. Currently attach touchGesture is locking system?
What is TouchHandlerViewPropefrty about?
Command Property Looks inviting. However there is no CommandParameter Property
When I am using ExpandbleView as a cell of ListView inside ListView.ItemTemplate
and on click I want to expand the cell but when I am expanding the layout, it over-lapping on top of below item cell.
Can you Please give me some suggestion how to resolve this.
Regarding the Primary and secondary view UI customization. If I wanted to create a primary View to be say a simple icon with a height and width of 50 in a frame along bottom of the page and I wanted the secondary View to be a more complex UI with a list view spanning the entire screen horizontally and some set height etc, see attached;. Is this possible?
When I try the above the primary view is always the width of the secondary which is full screen width however I only want the Primary to be a icon in a frame or something and the secondary to be full width etc. Is it possible to create views independent of each other with regards to this?
When using inside ListView, this is not working for iOS and have to pass SecondaryViewHeightRequest with ListView.
Hi great piece of control, question or enhancement is it possible to be notified when the expandable View is fully open and showing the secondary window. I want to run a task in the secondary view once it is fully open but right now while the secondary view is opening its freezing/slowing the UI while the secondary view is opening
Is it possible to have an ExpandableView inside another ExpandableView? and if so how can i achive it?
Example Code:
XAML
<expandable:ExpandableView>
<expandable:ExpandableView.PrimaryView>
<StackLayout BackgroundColor="Black" HeightRequest="200">
</StackLayout>
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<expandable:ExpandableView>
<expandable:ExpandableView.PrimaryView>
<StackLayout BackgroundColor="Green" HeightRequest="200">
</StackLayout>
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<StackLayout BackgroundColor="Blue" HeightRequest="200">
</StackLayout>
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
I can only access the "green" StackLayout, the secondary data for that StackLayout doesn't open (the "blue" StackLayout), is this an expected behaviour?
EDIT: If i set IsExpanded=true
in the inside ExpandableView, i can see that the animation happens, but not the expanding
I have an ExpandableView with some form controls inside a stack layout inside the secondary view. One of the controls opens a modal where the user selects some values, and the modal is popped when the user completes working with it. I have some labels inside the secondary view stack layout that initially have HeightRequest = 0. When the user closes the modal, these labels should appear (HeightRequest set to a positive value).
The issue I am having is that the secondary view does not resize to accommodate these newly resized controls. If I comment out the ExpandableView markup in my XAML and just have the stack layout on the view, it does resize as expected.
I'm trying to use ExpandableView to show a bit of text in the expanded view. This means that, depending on screen/window width and the length of the text, it can flow into several lines.
What I've found was that the secondary view's height is kept following the first initialisation of the view, so when I rotate the device it will either clip the content or show additional blank space.
In order to get the control to work roughly as expected I have had to implement a few changes to the ExpandableView.cs class, adding this override for OnSizeAllocated.
``
private double _previousWidth;
protected override void OnSizeAllocated(double width, double height)
{
base.OnSizeAllocated(width, height);
if (width == _previousWidth)
{
//nothing to do
return;
}
else if (this.Status != ExpandStatus.Expanded && this.Status != ExpandStatus.Expanding)
{
// secondaryview is not visible, we should reset it so that it'll appear in the correct size when active
_lastVisibleHeight = -1;
}
else if ( this.Status != ExpandStatus.Collapsed && this.Status != ExpandStatus.Collapsing)
{
// secondaryview is visible, needs resizing to fit new width
this.SecondaryViewHeightRequest = -1;
this.ForceUpdateSize();
}
this._previousWidth = width;
}
Out of a few attempts at fixing this, this was the most complete solution:
I am very keen on using this control (nice work Andrei), but can't really do it without fixing this problem.
Am I close to a (good enough) fix for the problem or have I somehow not noticed how resizing is supposed to be handled?
Thanks
If we click multiple times or expand and collapse it. the secondary view height automatically increases. can you please suggest on this?
Thanks
Hi! I would like to add a command when a PrimaryView is tapped. I've tried adding commands within my MainView ie
<expandable:ExpandableView.PrimaryView>
<Button Text="{Binding ChallengeGroup6.Name}"
TextColor="Black"
Command="{Binding OnItemCommand}"
Font="24"/>
</expandable:ExpandableView.PrimaryView>
However this removes the expandable action when I tap on the button. Any ideas on how to do this? Thanks for any help!
Hi,
thanks for your great component. I have a problem with the new XamarinForms4.4 gifs. My gif is invisible inside your component. What am I doing wrong?
<Expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<StackLayout>
<Image Source="imageAsPngIsShown.png" />
<Image Source="imageAsGifIsNotShown.gif" IsAnimationPlaying="True"/>
Hi, I have an issue with expandable view in landscape mode. The expandableview works great in portrait mode. But when its in landscape mode, the secondary view just fill up the whole screen with no scroll capability. Its only show show half of secondaryView child. I cannot scroll the secondaryview so another half child view in secondayviewtemplate is out of the screen.?
In my application the user can expand an item by tapping the icon to the right. This will also collapse any previously selected item. In general this works as expected;
Randomly however this will stop working and I get items that won't expand;
Or don't collapse;
The ListView ItemTemplate is;
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<expandable:ExpandableView
Spacing="0"
ExpandAnimationLength="100"
IsTouchToExpandEnabled="false"
IsExpanded="{Binding IsExpanded}">
<expandable:ExpandableView.PrimaryView>
<Grid
RowSpacing="0"
Padding="0"
Margin="5,0"
BackgroundColor="{Binding JobStatus, Converter={StaticResource StringToColourConverter}}">
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="40"/>
</Grid.ColumnDefinitions>
<Label
Grid.Row="0"
Grid.RowSpan="3"
Grid.Column="0"
Text="{Binding SequenceNumber}"
TextColor="{StaticResource SunburstOrange}"
FontSize="36"
HorizontalTextAlignment="Center"
WidthRequest="60"
HorizontalOptions="CenterAndExpand"
VerticalOptions="CenterAndExpand"/>
<Label
Grid.Row="0"
Grid.Column="1"
Text="{Binding JobLine1}"
TextColor="{StaticResource DarkSlateGrey}"
FontSize="17"
Margin="0,2,0,0"/>
<Label
Grid.Row="1"
Grid.Column="1"
Text="{Binding JobLine2}"
TextColor="{StaticResource DimGrey}"
FontSize="12"
Margin="0,0,0,0"/>
<Label
Grid.Row="2"
Grid.Column="1"
Text="{Binding JobLine3}"
TextColor="{StaticResource SunburstOrange}"
FontSize="12"
Margin="0,0,0,2"/>
<Button
Grid.Row="0"
Grid.RowSpan="3"
Grid.Column="2"
Text="{Binding JobIcon}"
FontSize="30"
TextColor="{StaticResource DarkSlateGrey}"
BackgroundColor="Transparent"
VerticalOptions="StartAndExpand"
HorizontalOptions="Center"
Padding="0"
WidthRequest="40"
HeightRequest="40"
Clicked="OnJobClicked"
CommandParameter="{Binding .}">
<Button.FontFamily>
<OnPlatform x:TypeArguments="x:String"
Android="Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free Solid"
iOS="Font Awesome 5 Free"
WinPhone="Assets/Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free" />
</Button.FontFamily>
</Button>
</Grid>
</expandable:ExpandableView.PrimaryView>
<expandable:ExpandableView.SecondaryViewTemplate>
<DataTemplate>
<Grid
Margin="0"
Padding="10,0,5,0"
BackgroundColor="{Binding JobStatus, Converter={StaticResource StringToColourConverter}}">
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="auto"/>
</Grid.ColumnDefinitions>
<Label
Grid.Row="0"
Grid.Column="0"
Text="Contact:"
TextColor="{StaticResource DarkSlateGrey}"
FontSize="12"
FontAttributes="Bold"
HorizontalTextAlignment="End"
VerticalTextAlignment="Start"/>
<Label
Grid.Row="0"
Grid.Column="1"
Text="{Binding ContactDetail}"
TextColor="{StaticResource DimGrey}"
FontSize="12"
VerticalTextAlignment="Start"
IsVisible="{Binding HasContactData}"/>
<!-- Call Contact -->
<Button
Grid.Row="0"
Grid.Column="2"
Text=""
FontSize="20"
TextColor="{StaticResource DarkSlateGrey}"
BackgroundColor="Transparent"
VerticalOptions="CenterAndExpand"
HorizontalOptions="Center"
Padding="0"
WidthRequest="30"
HeightRequest="30"
IsVisible="{Binding HasContactNumber}"
Clicked="OnCallClient"
CommandParameter="{Binding ContactPhone}">
<Button.FontFamily>
<OnPlatform x:TypeArguments="x:String"
Android="Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free Solid"
iOS="Font Awesome 5 Free"
WinPhone="Assets/Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free" />
</Button.FontFamily>
</Button>
<Label
Grid.Row="1"
Grid.Column="0"
Text="Address:"
TextColor="{StaticResource DarkSlateGrey}"
FontSize="12"
FontAttributes="Bold"
HorizontalTextAlignment="End"
VerticalTextAlignment="Start"/>
<Label
Grid.Row="1"
Grid.Column="1"
Text="{Binding JobAddress}"
TextColor="{StaticResource DimGrey}"
FontSize="12"
VerticalTextAlignment="Start"/>
<!-- Map -->
<Button
Grid.Row="1"
Grid.Column="2"
Text=""
FontSize="20"
TextColor="{StaticResource DarkSlateGrey}"
BackgroundColor="Transparent"
VerticalOptions="CenterAndExpand"
HorizontalOptions="Center"
Padding="0"
WidthRequest="30"
HeightRequest="30"
Clicked="OnMapClicked"
CommandParameter="{Binding .}">
<Button.FontFamily>
<OnPlatform x:TypeArguments="x:String"
Android="Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free Solid"
iOS="Font Awesome 5 Free"
WinPhone="Assets/Font Awesome 5 Free-Solid-900.otf#Font Awesome 5 Free" />
</Button.FontFamily>
</Button>
<Label
Grid.Row="2"
Grid.Column="0"
Text="Hours:"
TextColor="{StaticResource DarkSlateGrey}"
FontSize="12"
FontAttributes="Bold"
HorizontalTextAlignment="End"
VerticalTextAlignment="Start"/>
<Label
Grid.Row="2"
Grid.Column="1"
Text="{Binding OpeningHours}"
TextColor="{StaticResource DimGrey}"
FontSize="12"
VerticalTextAlignment="Start"/>
<Label
Grid.Row="3"
Grid.Column="0"
Text="Instructions:"
TextColor="{StaticResource DarkSlateGrey}"
FontSize="12"
FontAttributes="Bold"
HorizontalTextAlignment="End"
VerticalTextAlignment="Start"/>
<Label
Grid.Row="3"
Grid.Column="1"
Grid.ColumnSpan="2"
Text="{Binding Instructions}"
TextColor="{StaticResource StatusDanger}"
FontSize="12"
HorizontalOptions="FillAndExpand"/>
<StackLayout
Grid.Row="4"
Grid.Column="0"
Grid.ColumnSpan="3"
Orientation="Horizontal"
HorizontalOptions="Center"
Spacing="20"
Margin="0,0,0,5">
<Button
Text="Can't Complete"
TextColor="White"
BackgroundColor="{StaticResource ButtonDanger}"
BorderColor="{StaticResource SlateGrey}"
BorderWidth="1"
VerticalOptions="Start"
Padding="0,0,0,0"
HeightRequest="30"
WidthRequest="140"
CornerRadius="5"
Clicked="OnCantComplete"
CommandParameter="{Binding .}"/>
<Button
Text="Start"
BackgroundColor="{StaticResource ButtonOk}"
BorderColor="{StaticResource SlateGrey}"
BorderWidth="1"
VerticalOptions="Center"
Padding="0,0,0,0"
HeightRequest="30"
WidthRequest="140"
CornerRadius="5"
Clicked="OnStartJob"
CommandParameter="{Binding .}"/>
</StackLayout>
</Grid>
</DataTemplate>
</expandable:ExpandableView.SecondaryViewTemplate>
</expandable:ExpandableView>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
And the expand/collapse code is;
private void OnJobClicked(object sender, EventArgs e)
{
var btn = sender as Button;
var job = btn.CommandParameter as JobVm;
SelectJob(job);
var view = btn.Parent.Parent as Expandable.ExpandableView;
view.ForceUpdateSize();
}
private void SelectJob(JobVm job)
{
JobVm currentJob = null;
if (currentJobId.HasValue())
{
foreach (var run in groupedRunList)
{
currentJob = run.FirstOrDefault(x => x.Id == currentJobId);
if (currentJob != null) break;
}
}
if (currentJob != null && job.Id == currentJob.Id)
{
currentJob.IsExpanded = false;
currentJobId = string.Empty;
}
else
{
if (currentJob != null) currentJob.IsExpanded = false;
job.IsExpanded = true;
currentJobId = job.Id;
}
}
I added view.ForceUpdateSize(); in OnJobClicked to attempt to get the view to update but this didn't change the behaviour.
Hi,
In this sample we have upto second view. How to create a third view. can you help on this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.