ScrollView可以被maxHeight限制吗?

时间:2018-02-15 15:42:22

标签: react-native expo

ScrollView doc提到:

  

请记住,ScrollViews必须具有有限的高度才能工作,因为它们包含无限高度的子项到有界容器中(通过滚动交互)。为了限制ScrollView的高度,可以直接设置视图的高度(不鼓励),也可以确保所有父视图都具有有界高度。忘记在视图堆栈中向下传送{flex:1}可能会导致错误,元素检查器可以轻松调试。

是否可以将ScrollView与maxHeight绑定?这样ScrollView就会扩展,只有当孩子们超过maxHeight时才开始滚动?

我试图创建一个具有动态宽度/高度的居中模态组件,并允许在需要时滚动。我将高度限制在95%。看起来像scrollview总是需要95%的屏幕。如果我删除了scrollview,它会按预期工作。

在屏幕截图中,我希望红色框居中,白色框不应该出现。如果你想尝试解决我的问题,这是一个Expo Snack

enter image description here

有人能找到解决方案吗?或者有人可以确认这是不可能的,为什么?感谢

1 个答案:

答案 0 :(得分:5)

有人帮我解决了这个问题。我需要在ScrollView上添加library(stringr) library(purrr) library(tibble) library(dplyr) data <- c("Red Team", "Mike Johnson", "QB" ,"6-1","191", "99" ,"21" ,"2","5","Joe Smith" , "OT" ,"6-3" , "290" , "98" ,"55", "3" ,"1") team <- data[1] people <- data[-1] resulting_df <- people %>% split(ceiling(seq_along(people)/8)) %>% map(~ as_tibble(t(.x))) %>% bind_rows() %>% add_column(team = team) resulting_df #> # A tibble: 2 x 9 #> V1 V2 V3 V4 V5 V6 V7 V8 team #> <chr> <chr> <chr> <chr> <chr> <chr> <chr> <chr> <chr> #> 1 Mike Johnson QB 6-1 191 99 21 2 5 Red Team #> 2 Joe Smith OT 6-3 290 98 55 3 1 Red Team

这是因为默认情况下ScrollView有flexGrow: 0。请注意,在ScrollView上使用flexGrow: 1将无法正常工作,因为它不会覆盖默认的flexGrow。

https://snack.expo.io/S1N027QPf