Theory
rules જે કોઈ વાંચી શકતું નહોતું
Garba Night details screen grew: poster, description, timing, dress code, 12 rules. તમારા emulator પર તે fit થયું. classmate ના smaller phone પર, everything after rule 4 simply did not exist: કોઈ error નહીં, કોઈ hint નહીં, ફક્ત clipped.
Android layouts પોતે scroll નથી થતા; content screen ની edge થી past silently invisible છે. fix એ wrapper છે જેનું whole job scrolling છે: ScrollView: plus તેનો sideways twin, અને one strict law children વિશે.
Theory
બે scrollers, formally
ScrollView તેના content ને vertically scroll કરે છે: reading direction: long forms, detail pages, rules.
HorizontalScrollView એ separate widget છે sideways travel માટે: photo strips, sponsor logos, filter chips ની row.
એક widget, એક axis: vertical ScrollView sideways scroll નથી કરતું, અને classic toolkit માં કોઈ both-axes scroller નથી (rare map-like need માટે એક ને બીજા ની અંદર nest કરો).
sizing habit: scroller ને match_parent height મળે છે; તેનું content wraps: wrap_content.
Formula
one-child law
ScrollView (અને તેના horizontal twin) ફક્ત exactly ONE direct child ને hold કરી શકે છે.
બે TextViews તેની અંદર directly placed થાય છે તો તે inflate પણ નથી થતા: IllegalStateException: ScrollView can host only one direct child.
pattern, હંમેશા: એક layout ને અંદર મૂકો (ScrollView માટે vertical LinearLayout, HorizontalScrollView માટે horizontal one), અને બધું તેની અંદર stack કરો. એક wrapper, એક child, unlimited grandchildren.
Practical
event_details.xml: scrolling page + sponsor strip
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- એક direct child -->
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView android:id="@+id/poster"
android:layout_width="match_parent"
android:layout_height="220dp" />
<TextView android:id="@+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<!-- vertical page ની અંદર sideways strip -->
<HorizontalScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- sponsor ImageViews અહીં line up થાય છે -->
</LinearLayout>
</HorizontalScrollView>
<TextView android:id="@+id/rules"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</ScrollView>
This example runs in Gri-Learn on the web, where you can edit it and see the output.
Quiz
layout 2 TextViews ને ScrollView ની અંદર directly મૂકે છે. શું થાય છે જ્યારે screen open થાય છે?
- બંને show થાય છે; ScrollView તેમને vertically stack કરે છે જેમ LinearLayout
- app inflate time પર crash થાય છે: ScrollView ફક્ત એક direct child ને host કરી શકે છે
- ફક્ત first TextView show થાય છે; second ને warning સાથે ignored કરવામાં આવે છે
- તેઓ overlap થાય છે, બંને top પર anchored
Show the answer
app inflate time પર crash થાય છે: ScrollView ફક્ત એક direct child ને host કરી શકે છે
one-child law એ IllegalStateException સાથે enforced થાય છે જે moment XML inflate થાય છે: screen ક્યારેય appear નથી થતી. ScrollView એ scrolling WRAPPER છે, stacking layout નહીં: children ને arrange કરવું એ LinearLayout નું job છે, જે exactly છે શા માટે canonical structure એ ScrollView holding one LinearLayout holding everything છે. Option A ScrollView ને abilities grant કરે છે જે તે deliberately lacks કરે છે; options C અને D mercies ને describe કરે છે (silent ignoring, overlap) જે other containers show કરે છે પણ ScrollView refuse કરે છે. એક wrapper, એક child: grandchildren unlimited છે.
Think first
scroller જે ListView ને ate કર્યું
classmate last lesson ના event ListView ને details ScrollView ની અંદર wrap કરે છે જેથી આખું page together scroll થાય. બે distinct things wrong થાય છે. તેમને reason out કરો કે દરેક widget કેવી રીતે scroll કરે છે તેનાથી, પછી tap.
Show the answer
Gesture war: બંને widgets vertical swipes ને claim કરે છે; touch એક તરફ જાય છે અને બીજું properly scroll નથી થતું: list stunted strip બને છે. Recycling dies: ScrollView ની અંદર, ListView ને તેના FULL content height માં measured કરવામાં આવે છે (scroller એ તેના child નું size જાણવું જોઈએ), તેથી બધા 10000 rows એક સાથે inflate થાય છે: ListView lesson નો thali system 10000 plates માં collapse થાય છે. rule: ListView ITSELF scroll થાય છે, ક્યારેય scroller માં wrapped નહીં; long mixed pages either extra content ને list ના header/footer views માં મૂકે છે, અથવા mix ને avoid કરે છે.
Watch out
Scroll traps
invisible clipping: કોઈ scroller નથી એટલે content screen edge થી past silently vanishes થાય છે: SMALL screen પર test કરો, ફક્ત તમારા emulator પર નહીં.
Wrong axis: HorizontalScrollView માં text wrap નથી થતું અને sideways walk off થાય છે; reading content vertical one ને wants છે.
Short content, ugly gap: ScrollView જેનું content screen થી shorter હોય તે dead space ને leave કરે છે; android:fillViewport="true" child ને fill કરવા stretch કરે છે.
Scroller inside scroller (same axis): ListView story ફરીથી: કોઈ પણ બે same-axis scrollers fight કરે છે.
Theory
Scrolling એ wrapper છે, property નહીં
design insight worth keeping: Android માં, scrolling એ layout પર checkbox નથી: તે CONTAINER છે જે તમે deliberately add કરો છો, એક axis એક સમયે, exactly એક child ની આસપાસ. (Flutter, Unit 3 માં waiting, same move કરે છે SingleChildScrollView સાથે: name same law ને confess કરે છે.) next lesson search box think કરવાનું શીખે છે: AutoCompleteTextView BCA305-02 થી returns થાય છે deeper second pass માટે, TextWatcher ના full machinery સાથે.
Summary
Key takeaways
- ScrollView vertically scroll કરે છે; HorizontalScrollView એ separate sideways widget છે: એક axis દરેક.
- દરેક exactly ONE direct child ને hold કરી શકે છે: content ને એક single LinearLayout માં wrap કરો તેની અંદર.
- બે direct children = inflate પર IllegalStateException: screen ક્યારેય open નથી થતી.
- ક્યારેય ListView ને ScrollView માં wrap ન કરો: gestures fight કરે છે અને recycling breaks થાય છે.
- fillViewport="true" short content ને stretch કરે છે screen ને fill કરવા.
- content past screen edge scroller વગર silently clipped છે: small screens ને test કરો.
- Memory hook: એક wrapper, એક axis, એક child.