Nativescript: Css overflow property support

[terreb]

Currently if a child view overflows its parent iOS and Android behaves differently. iOS shows the child overflowed parts while Android doesn't. In order to make this controllable it would be great to introduce css overflow property.

To see what I mean please try the next on iOS and Android:

<Page xmlns="http://schemas.nativescript.org/tns.xsd" >
 <GridLayout>
    <AbsoluteLayout width="100" height="100" backgroundColor="green">
        <GridLayout width="100" height="100" backgroundColor="red" top="20" left="-20">
        </GridLayout>
    </AbsoluteLayout>
 </GridLayout>
</Page>

---

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[NickIliev]

Hey @terreb you can achieve overflow even now using an AbsoluteLayout for parent container and adjusting your child elements flow according to it.

_For example:_

    <AbsoluteLayout width="400" height="400">
        <GridLayout width="200" height="200" backgroundColor="red" id="mr-red" top="20" left="20"/>
        <GridLayout width="200" height="200" backgroundColor="green" id="mr-green" />
        <GridLayout width="50" height="50" backgroundColor="blue" id="mr-blue"  top="210" left="50"/>
    </AbsoluteLayout>

[NordlingDev]

I've seen the property clipsToBounds in WrapLayout only. Not sure if it actually works or not. It's not available for any other layouts.

[timricker]

+1 for this feature, it would make developing advanced/complex UX much easier

[dapperapps]

+1

[poul-kg]

+1

[vijaykumarbollavaram]

+1

[jeremypele]

Would be really usefull indeed

[ninjaonsafari]

any update on this one?

[NordlingDev]

How would this work? I mean, overflow: auto would technically convert a StackLayout or any other layout to a ScrollView, possible wrapping the layout inside of it. Not to mention that ScrollView doesn't support multi-directional scrolling.

[KLLaw]

+1

[gabriel-anglada]

+1

[vultix]

Is there any work going into this feature? It would be a very useful feature to have.

[ogrinishin]

+1

[chuckmitchell]

+1

[poul-kg]

We moved to fusetools framework. Pixel perfect on both ios and andriod

[snq]

@NickIliev your solution doesn't achieve the overflow functionality. What overflow should achieve is that it allows one layout/object to be seen/selectable if its position exceeds the boundaries of its parent layout.

Unfortunately z-index doesn't help for this sort of problem either.

[18clans]

Any update on this or a work around?

[franklevasseur]

+1

[ghost]

:+1:

But thats simply concept of _(native)_ Android. A _view_ is a _rectangle_ and nothing can be drawn outside of its borders, even no shadowing - not even the outline. Thats why android is using _elevation_ for shadowing of views.

[hettiger]

I'm looking for something like this as well. I have a container with a border-radius. On iOS child element background does not overflow the parent respecting the border-radius. On Android the border-radius is being ignored.

[brandart]

+1

[szhatef]

clipToBound works, but if it set as true, and parent has borderRadius, {N} neglect the space between parent and child!

8929