andreimisiukevich / expandableview Goto Github PK

View Code? Open in Web Editor NEW

174.0 2.0 17.0 600 KB

Expandable view for Xamarin.Forms

License: MIT License

C# 100.00%

xamarin xamarin-forms expandableview expandable expander collapsible

expandableview's People

Contributors

Stargazers

Watchers

Forkers

esskar martinopde kennydizi flutterbuddy77 janiceattard patel-pragnesh jlovely chenxiaobaopros julianocristian aydonis piseysen marcdieters joseplj bhekinkosi12 sprakashnet1 oridotaoyebode barkerbg001

expandableview's Issues

gif not shown

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"/>

Second ExpanderView PrimaryView height issue when First Status changes to Expanded iOS - CollectionView

<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;
                        });


                    }

                }
            }
        }


    }

}

iOS ScreenShot

Only 1st item selected(look at Item2 height) - this is wrong

Other selections which look fine

None expanded

all 3 expanded

middle only expanded

last 2 expanded

last only expanded

Tried calling expander.ForceUpdateSize() and (expander.PrimaryView as Grid).ForceLayout() but dint work as expected.

Android

On android it is fine.

Nested ExpandableView

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

Select Item in View Programmatically

From the secondary view the user can select a record and once they have completed entering the data and click save I want to;

Return to the expandable view.
Collapse the currently selected view.
Programmatically select the next item in the view.
Expand the item selected in step 3.

Is it possible to programmatically select the next item in the view?

Strange interaction of components while animating

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

Primary and secondary views sharing the same width always.

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?

Add Status and StatusChanged event

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

Cell is overlapping on each other.

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.

[Enhancement] Add OnExpanding and OnCollapsing events.

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

Secondary view doesn't resize when (eg) rotating the device

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:

it resizes on UWP when resizing the window.
it resizes when rotating the device the secondary view is open.
it resizes correctly when you open the view, close it and rotate the device/resize the window, then reopen the view.

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

Make Expander control

The same control, but:

Status should be renamed to State
SecondaryViewHeightRequest is removed

Spy names on WPF https://www.wpf-tutorial.com/misc-controls/the-expander-control/

Next level of view

Hi,
In this sample we have upto second view. How to create a third view. can you help on this?

Expand an item one at a time

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

ExpandableView fill whole page when in Landscape mode. Cannot scroll

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.?

Random Cells Do Not Expand/Collapse

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="&#xf095;" 
								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="&#xf59f;" 
								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.

Extra bottom space with custom control

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.

Slow Loading WebView

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>

Last item in list view - expanding not immediately allowing scroll to reveal secondary-view

Hi @AndreiMisiukevich

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)

Please sample of usage with Binding from XAML

You provide a sample in this repo but don't using bindable items from xaml. Could you give us this sample? Thanks

Growing Secondary View if Padding was set

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

How to collapse view via code?

Hello! Thank you for such usefull plugin, could you please tell is there some API to collapse/expand view programmatically?

Compatibility with Xamarin Forms 3.4

Hi @AndreiMisiukevich , great plugin to use.

Is this plugin compatible with XF v 3.4 ?

Thanks

Not working inside ListView iOS

When using inside ListView, this is not working for iOS and have to pass SecondaryViewHeightRequest with ListView.

Can you add SecondaryView for xaml?

Now i want do some customized layout or some animation in your control but it's must use SecondaryViewTemplate.

Collapsing and expanding is leaving empty space where SecondaryView was

Hi @AndreiMisiukevich

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)

Height automatically increase of secondary view if we expand and collapse multiple times

If we click multiple times or expand and collapse it. the secondary view height automatically increases. can you please suggest on this?

Thanks

NaNis not valid for height in IOS

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"...

x:Name in ExpandableView.SecondaryViewTemplate

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.

ScrollView Not showing in Sample Code

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 
        };
    }

Adding Command to PrimaryView

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!

Does ExpandableView Support BindingContext As Collection.

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

Changing height of secondary view when contained controls change

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.

TouchHandlerView Property and CommandProperty

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

[Feature Request]: Scroll To Secondary View If Out Of Bounds

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.

andreimisiukevich / expandableview Goto Github PK

expandableview's People

Contributors

Stargazers

Watchers

Forkers

expandableview's Issues

iOS ScreenShot

Only 1st item selected(look at Item2 height) - this is wrong

Other selections which look fine

None expanded

all 3 expanded

middle only expanded

last 2 expanded

last only expanded

Android

Recommend Projects

Recommend Topics

Recommend Org