Comments (7)
@zamiang I merged in the PR to allow for passing in styles. I'll do a release over the weekend. Good call on the flex: 1 issue, I'll take a look and see if it makes sense to remove it. Leaving this open until then. Thanks!
from react-native-swipe-list-view.
Hey @zamiang happy to look into this but I think I'm missing the issue. The first two items look like they're of equal height. The third item looks larger on the right but it's not equal to the height of any other items. So is the issue that the height of the third item is unexpectedly larger?
If you could provide some snippets of code for the ListView
and SwipeListView
that would be really helpful.
Also if you'll take a look at this line:
you'll see that any props you pass to the SwipeListView
are passed to the underlying ListView
, meaning a style
or contentContainerStyle
prop will be passed along and you can style the container as you need.
from react-native-swipe-list-view.
Thanks! Here is a bit more detail. TLDR - All rows have flex: 1
applied in a way that I cannot override. https://github.com/jemise111/react-native-swipe-list-view/blob/master/components/SwipeRow.js#L250
Color key:
- yellow is background of the the SwipeListView
- purple and gray are alternating backgrounds of a component passed to
renderRow
I believe the correct fix would be to allow passing custom styles to the SwipeRow (similar to the SwipeListView) rather than removing that line.
from react-native-swipe-list-view.
@zamiang Okay so without your code to run and I can't really test if this will fix your problem. But when checkout this PR, #40, when you have a sec and let me know if it fixes your issue. Then I'll merge and release a new version. Thanks!
from react-native-swipe-list-view.
That looks great! Thanks so much.
I have gained a bit more insight into the root issue. React-native 0.28 made changes to how flex: 1 vs flex: 0 works. I have been seeing similar pull requests / issues with other projects. In the release notes you will see this note:
"flex styling property behavior now behaves slightly differently. If you previously used flex: 1 where not necessary this change will likely break your layout as the measuring behavior is slightly different than before due to performance optimizations. Removing that unnecessary flex: 1 will solve your layout in most cases."
That note suggests that just removing the flex: 1 declaration would fix the issue -- and remove the need (in this case!) for styling the SwipeRow (though that may be a good thing for the project anyway)
from react-native-swipe-list-view.
Removed flex: 1, closing. Fixed by #40 and #43
from react-native-swipe-list-view.
Thanks!
from react-native-swipe-list-view.
Related Issues (20)
- Question: Change SwipeRow style when swiping started
- SwipeListView actions pass incorrect item in rowMap when using SectionList
- shouldItemUpdate does not seem to work in version 3.2.9
- example how to close rows automatically or by some function when use SwipeRow? HOT 2
- No overload matches this call HOT 7
- Not working with scrollview
- delete button in renderHiddenItem components covers the first button when clicked HOT 1
- Make it harder to start the swipe HOT 1
- SwipeRow : Unable to close row programatically. HOT 3
- react-native-swipe-list-view is not fabric(New Architecture of react-native) compatible yet HOT 2
- ScrollToOffset can't scroll pass through {initialNumToRender}-th row. HOT 1
- Front-view is under the back/hidden-view HOT 4
- Facing issue while implimenting Swipe to Delete feature
- closeOpenAllRows not working on Android HOT 2
- Any way to open a row with a button?
- Question, are you no longer doing library management? HOT 1
- RenderItem, RenderHiddenItem, RenderRow, RenderHiddenRow
- rightActionState true/false wrong
- Open row by key
- There is a memory overflow issue with a single demo
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-swipe-list-view.