My ScrollView is not scrolling unfortunately, I've tried the solutions posted here: React-Native, Scroll View Not Scrolling, but it doesn't seem to help. Has anyone encountered this and is able to help me with this?
<View style={styles.container}>
<View style={{ flex: 1 }}>
<ImageBackground
style={{ height: "100%", width: "100%" }}
source={{ uri: IMAGE }}
resizeMode="cover"
>
<Overlay styleName="fill-parent">
<Title>Title</Title>
{this.renderOffer()}
{this.renderSwitch()}
</Overlay>
</ImageBackground>
</View>
<View style={{ backgroundColor: "white", flex: 1 }}>
<View style={{ paddingTop: 5 }}>
<Title styleName="md-gutter-bottom h-center">Title</Title>
</View>
<ScrollView
style={{
backgroundColor: "white",
flex: 1,
marginBottom: 5,
marginTop: 0
}}
>
<Caption style={{ margin: 10 }}>
A Stop on the Salt Route 1000 B.C. As they rounded a bend in the
path that ran beside the river, Lara recognized the silhouette
of a fig tree atop a nearby hill. The weather was hot and the
days were long. The fig tree was in full leaf, but not yet
bearing fruit. Soon Lara spotted other landmarks—an outcropping
of limestone beside the path that had a silhouette like a man’s
face, a marshy spot beside the river where the waterfowl were
easily startled, a tall tree that looked like a man with his
arms upraised. They were drawing near to the place where there
was an island in the river. The island was a good spot to make
camp. They would sleep on the island tonight. Lara had been back
and forth along the river path many times in her short life. Her
people had not created the path—it had always been there, like
the river—but their deerskin-shod feet and the wooden wheels of
their handcarts kept the path well worn. Lara’s people were salt
traders, and their livelihood took them on a continual journey.
At the mouth of the river, the little group of half a dozen
intermingled families gathered salt from the great salt beds
beside the sea. They groomed and sifted the salt and loaded it
into handcarts. When the carts were full, most of the group
would stay behind, taking shelter amid rocks and simple
lean-tos, while a band of fifteen or so of the heartier members
set out on the path that ran alongside the river. With their
precious cargo of salt, the travelers crossed the coastal
lowlands and traveled toward the mountains. But Lara’s people
never reached the mountaintops; they traveled only as far as the
foothills. Many people lived in the forests and grassy meadows
of the foothills, gathered in small villages. In return for
salt, these people would give Lara’s people dried meat, animal
skins, cloth spun from wool, clay pots, needles and scraping
tools carved from bone, and little toys made of wood. Their
bartering done, Lara and her people would travel back down the
river path to the sea. The cycle would begin again. It had
always been like this. Lara knew no other life. She traveled
back and forth, up and down the river path. No single place was
home. She liked the seaside, where there was always fish to eat,
and the gentle lapping of the waves lulled her to sleep at
night. She was less fond of the foothills, where the path grew
steep, the nights could be cold, and views of great distances
made her dizzy. She felt uneasy in the villages, and was often
shy around strangers. The path itself was where she felt most at
home. She loved the smell of the river on a hot day, and the
croaking of frogs at night. Vines grew amid the lush foliage
along the river, with berries that were good to eat. Even on the
hottest day, sundown brought a cool breeze off the water, which
sighed and sang amid the reeds and tall grasses. Of all the
places along the path, the area they were approaching, with the
island in the river, was Lara’s favorite. The terrain along this
stretch of the river was mostly flat, but in the immediate
vicinity of the island, the land on the sunrise side was like a
rumpled cloth, with hills and ridges and valleys. Among Lara’s
people, there was a wooden baby’s crib, suitable for strapping
to a cart, that had been passed down for generations. The island
was shaped like that crib, longer than it was wide and pointed
at the upriver end, where the flow had eroded both banks. The
island was like a crib, and the group of hills on the sunrise
side of the river were like old women mantled in heavy cloaks
gathered to have a look at the baby in the crib—that was how
Lara’s father had once described the lay of the land. Larth
spoke like that all the time, conjuring images of giants and
monsters in the landscape. He could perceive the spirits, called
numina, that dwelled in rocks and trees. Sometimes he could
speak to them and hear what they had to say. The river was his
oldest friend and told him where the fishing would be best. From
whispers in the wind he could foretell the next day’s weather.
Because of such skills, Larth was the leader of the group.
“We’re close to the island, aren’t we, Papa?” said Lara. “How
did you know?” “The hills. First we start to see the hills, off
to the right. The hills grow bigger. And just before we come to
the island, we can see the silhouette of that fig tree up there,
along the crest of that hill.” “Good girl!” said Larth, proud of
his daughter’s memory and powers of observation. He was a
strong, handsome man with flecks of gray in his black beard. His
wife had borne several children, but all had died very young
except Lara, the last, whom his wife had died bearing. Lara was
very precious to him. Like her mother, she had golden hair. Now
that she had reached the age of childbearing, Lara was beginning
to display the fullness of a woman’s hips and breasts. It was
Larth’s greatest wish that he might live to see his own
grandchildren. Not every man lived that long, but Larth was
hopeful. He had been healthy all his life, partly, he believed,
because he had always been careful to show respect to the numina
he encountered on his journeys. Respecting the numina was
important. The numen of the river could suck a man under and
drown him. The numen of a tree could trip a man with its roots,
or drop a rotten branch on his head. Rocks could give way
underfoot, chuckling with amusement at their own treachery. Even
the sky, with a roar of fury, sometimes sent down fingers of
fire that could roast a man like a rabbit on a spit, or worse,
leave him alive but robbed of his senses. Larth had heard that
the earth itself could open and swallow a man; though he had
never actually seen such a thing, he nevertheless performed a
ritual each morning, asking the earth’s permission before he
went striding across it. “There’s something so special about
this place,” said Lara, gazing at the sparkling river to her
left and then at the rocky, tree-spotted hills ahead and to her
right. “How was it made? Who made it?” Larth frowned. The
question made no sense to him. A place was never made, it simply
was. Small features might change over time. Uprooted by a storm,
a tree might fall into the river. A boulder might decide to
tumble down the hillside. The numina that animated all things
went about reshaping the landscape from day to day, but the
essential things never changed, and had always existed: the
river, the hills, the sky, the sun, the sea, the salt beds at
the mouth of the river. He was trying to think of some way to
express these thoughts to Lara, when a deer, drinking at the
river, was startled by their approach. The deer bolted up the
brushy bank and onto the path. Instead of running to safety, the
creature stood and stared at them. As clearly as if the animal
had whispered aloud, Larth heard the words “Eat me.” The deer
was offering herself.
</Caption>
</ScrollView>
</View>
<View
style={{
flex: 0.2,
flexDirection: "row",
justifyContent: "space-between",
margin: 5
}}
>
<View
style={{
flex: 1,
margin: 5,
marginTop: 0,
marginRight: 0,
flexDirection: "row",
borderRadius: 5,
borderColor: "white",
borderWidth: 2
}}
>
<View
style={{
flex: 1,
borderRadius: 5,
flexDirection: "row",
justifyContent: "center"
}}
>
<Button
transparent
onPress={() => {
var tickets = this.state.numTickets;
tickets = Math.max(0, tickets - 1);
this.setState({ numTickets: tickets });
}}
>
<Entypo name="minus" size={25} style={{ color: "white" }} />
</Button>
</View>
<View
style={{
flex: 2,
alignItems: "center",
justifyContent: "center"
}}
>
<Text style={{ color: "white", fontSize: 16 }}>
{this.state.numTickets}
</Text>
</View>
<View
style={{
flex: 1,
borderRadius: 5,
justifyContent: "space-around",
flexDirection: "row"
}}
>
<Button
style={{ alignItems: "center" }}
transparent
onPress={() => {
var tickets = this.state.numTickets;
tickets = Math.max(0, tickets + 1);
this.setState({ numTickets: tickets });
}}
>
<Entypo name="plus" size={25} style={{ color: "white" }} />
</Button>
</View>
</View>
<View
style={{
flex: 1,
margin: 5,
marginTop: 0,
borderRadius: 5,
borderColor: "white",
borderWidth: 2,
alignItems: "center",
flexDirection: "row",
justifyContent: "center"
}}
>
<Text style={{ fontSize: 16, color: "white" }}>
Pay €{price * this.state.numTickets}
</Text>
</View>
</View>
</View>;
It seems like I've set flex: 1
to all the relevant views, but it's still not possible to make it scroll.
Thanks in advance for any hints on how to improve this.
try adding <ScrollView contentContainerStyle={{flexGrow:1}}>
to your <ScrollView>
component.
I had the same issue and this solved it.
Maybe you should try giving height
and width
to your ScrollView
component. And also, set horizontal
prop to false.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With