Scroll Views

5 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$99.99
List Price:  $139.99
You save:  $40
€92.78
List Price:  €129.90
You save:  €37.11
£79.40
List Price:  £111.16
You save:  £31.76
CA$136.11
List Price:  CA$190.56
You save:  CA$54.44
A$154.13
List Price:  A$215.78
You save:  A$61.65
S$135.08
List Price:  S$189.12
You save:  S$54.03
HK$782.28
List Price:  HK$1,095.23
You save:  HK$312.94
CHF 90.61
List Price:  CHF 126.85
You save:  CHF 36.24
NOK kr1,085.23
List Price:  NOK kr1,519.37
You save:  NOK kr434.13
DKK kr692.01
List Price:  DKK kr968.84
You save:  DKK kr276.83
NZ$167.80
List Price:  NZ$234.94
You save:  NZ$67.13
د.إ367.19
List Price:  د.إ514.08
You save:  د.إ146.89
৳10,976.08
List Price:  ৳15,366.96
You save:  ৳4,390.87
₹8,339.52
List Price:  ₹11,675.66
You save:  ₹3,336.14
RM473.25
List Price:  RM662.57
You save:  RM189.32
₦141,842.81
List Price:  ₦198,585.61
You save:  ₦56,742.80
₨27,810.04
List Price:  ₨38,935.18
You save:  ₨11,125.13
฿3,647.70
List Price:  ฿5,106.92
You save:  ฿1,459.22
₺3,232.12
List Price:  ₺4,525.11
You save:  ₺1,292.98
B$499.21
List Price:  B$698.91
You save:  B$199.70
R1,908.54
List Price:  R2,672.04
You save:  R763.49
Лв180.65
List Price:  Лв252.92
You save:  Лв72.26
₩135,197.71
List Price:  ₩189,282.20
You save:  ₩54,084.49
₪368.63
List Price:  ₪516.10
You save:  ₪147.47
₱5,633.91
List Price:  ₱7,887.71
You save:  ₱2,253.79
¥15,144.47
List Price:  ¥21,202.86
You save:  ¥6,058.39
MX$1,659.40
List Price:  MX$2,323.22
You save:  MX$663.82
QR364.31
List Price:  QR510.04
You save:  QR145.73
P1,370.91
List Price:  P1,919.33
You save:  P548.42
KSh13,148.68
List Price:  KSh18,408.68
You save:  KSh5,260
E£4,729.52
List Price:  E£6,621.52
You save:  E£1,892
ብር5,680.63
List Price:  ብር7,953.11
You save:  ብር2,272.48
Kz83,612.74
List Price:  Kz117,061.18
You save:  Kz33,448.44
CLP$97,978.20
List Price:  CLP$137,173.40
You save:  CLP$39,195.20
CN¥722.95
List Price:  CN¥1,012.16
You save:  CN¥289.21
RD$5,921.50
List Price:  RD$8,290.34
You save:  RD$2,368.83
DA13,490.83
List Price:  DA18,887.70
You save:  DA5,396.87
FJ$226.12
List Price:  FJ$316.58
You save:  FJ$90.46
Q779.86
List Price:  Q1,091.83
You save:  Q311.97
GY$20,923.51
List Price:  GY$29,293.76
You save:  GY$8,370.24
ISK kr13,946.60
List Price:  ISK kr19,525.80
You save:  ISK kr5,579.20
DH1,013.19
List Price:  DH1,418.51
You save:  DH405.32
L1,763.34
List Price:  L2,468.75
You save:  L705.40
ден5,702.11
List Price:  ден7,983.18
You save:  ден2,281.07
MOP$805.89
List Price:  MOP$1,128.28
You save:  MOP$322.39
N$1,893.44
List Price:  N$2,650.90
You save:  N$757.45
C$3,681.15
List Price:  C$5,153.75
You save:  C$1,472.60
रु13,335.63
List Price:  रु18,670.42
You save:  रु5,334.78
S/370.84
List Price:  S/519.19
You save:  S/148.35
K382.72
List Price:  K535.82
You save:  K153.10
SAR375
List Price:  SAR525.01
You save:  SAR150.01
ZK2,522.76
List Price:  ZK3,531.96
You save:  ZK1,009.20
L461.43
List Price:  L646.02
You save:  L184.59
Kč2,350.75
List Price:  Kč3,291.15
You save:  Kč940.39
Ft36,729.02
List Price:  Ft51,422.10
You save:  Ft14,693.08
SEK kr1,071.30
List Price:  SEK kr1,499.86
You save:  SEK kr428.56
ARS$85,766.82
List Price:  ARS$120,076.98
You save:  ARS$34,310.16
Bs691.04
List Price:  Bs967.48
You save:  Bs276.44
COP$387,583.68
List Price:  COP$542,632.66
You save:  COP$155,048.97
₡50,832.34
List Price:  ₡71,167.31
You save:  ₡20,334.97
L2,468.78
List Price:  L3,456.40
You save:  L987.61
₲737,805.73
List Price:  ₲1,032,957.54
You save:  ₲295,151.80
$U3,781.90
List Price:  $U5,294.82
You save:  $U1,512.91
zł400.73
List Price:  zł561.05
You save:  zł160.31
Already have an account? Log In

Transcript

Okay, let's discuss this crawl view. A scroll view allows users to browse content, such as stacks in a document or a collection of images that's larger than the visible area. So you scroll you to give people access to large views, or to large numbers of views in a constrained space. Not that scrollview has no predefined appearance, except for the scroll bars appearing. As people swipe, Li crack, tap and pinch. A scroll view follows this gesture.

Revealing or zooming content in a way that feels natural scroll view itself has no appearance, but it does display transient scrolling indicators as people interact with it. A scroll view can also be configured to operate in Beijing, where scrolling reveals an entirely new page of content rather than moving around the current page. So the scroll view flashes transiting scroll indicators, also called scroll bars. When it first appears, and when users interact with the scroll view, as well. scroll bars are made visible as long as user is scrolling content. It responds to the speed and direction of gestures to reveal content in a way that feels natural.

For example, when users are slowly truck content in a scroll view, the content follows the touch. When users click content, on the other hand, the scroll view reveals content quickly and stops after some time. So this crawling needs to have inertia and friction. It also stops crawling when the user touches the screen, or when the end of the continent is reached. Also note that the iOS has this great little detail called a rubber band effect or elastic scrolling, which is my favorite thing when the end of scrollable areas and reached it lets you track the rubber a little bit The scroll view can also operate in a paging mode, in which each kragh a flick gesture reveals one up defined page of content. It's used often in the app walkthroughs together with the page control.

When you want to display content that's divided into pagers, screen polls or other chunks. You can use a pitch control to show users how many chunks are available and which one they're currently viewing. And when you do that, disable the scroll indicator that's on the same axis as the pitch control. Removing the scroll indicator as you understand focuses attention on the pitch control and gives people one unambiguous way to pitch through the content. If it makes sense in your app, lets users pinch or double tap to zoom into and out of a straw view. Here I am mentioning and then branching out of the image then I double top For the images, usually, the first double tap zooms in, and the next double tap zooms out.

Take a look at double tapping in Google Maps though. Each double tap just zooms for the up to the point, when there is nowhere to zoom into, and the zoom stops. I think it just starts taking you back. Just as with images, it should start as a mild when you hit the end, and zoom out you're starting low for example. When you enable zoom, you should also set the maximum and the minimum scale values that makes sense in the context of the users task. For example, letting users zoom in on text into one character feels This train is unlikely to make it easier for them to read the content.

So make sure the zoom levels make sense guys. Apple recommends to display just one scroll view at a time in general. guidelines claim that because people often make large swipe gestures when they scroll It can be difficult for them to avoid interacting with a neighboring scroll you on the same screen guidelines or command that if you decide to put two scroll views on one screen, consider allowing them to scroll in different directions so that one gesture is less likely to scroll both views. And yeah, the stocks app, for example does just that. As you see here, the top part is vertically scrollable. And the bottom part is horizontal scrollable in a paging mode, but take a look at Apple's own App Store app, which contradicts the guidelines of displaying only one scroll view at a time.

We have multiple scroll views here. And guess what people are completely fine using them. It does not hinder user experience. So you can do this as well. Lastly, don't place a scroll view inside of another strong view. Doing so creates an unpredictable interface that's difficult to control.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.