Navigating scrollable sections of content in a viewing area
Systems and methods for displaying an interface are provided. A system and method can be configured to display a scrollable viewing region. The viewing region can be a fixed size and the viewing region can facilitate displaying underlying content. Underlying content can be divided into multiple sectioned viewing areas, and each sectioned viewing area can have a corresponding heading. Headings can be docked or undocked. Input corresponding to a scroll movement can be received, and the viewing region can be adjusted according to the scroll movement. Adjusting a viewing region can include shifting the display of the underlying content by docking or undocking headings. Headings can be docked or undocked as they occur in the underlying content.
1. A computer-implemented method, comprising:
displaying, on a computing device, a view panel having a first end and an opposing second end, the view panel displaying scrollable sections, wherein
each scrollable section includes a heading bar and exposable content, wherein the exposable content of a scrollable section, when visible, is situated between the heading bar and the second end,
when a particular heading bar, which is any heading bar of the view panel, is docked on either the first end or the second end, no exposable content is visible between the particular heading bar and the end on which the particular heading bar is docked, and
the particular heading bar cannot scroll past a given end of the view panel without first becoming docked in a stack at the given end of the view panel;
receiving input corresponding to scrolling the particular heading bar that is docked, the particular heading bar being associated with a particular scrollable section;
when the particular heading bar is docked against the second end and the input corresponds to scrolling the particular heading bar toward the first end, scrolling the particular heading bar toward the first end while (a) exposing first exposable content of the particular scrollable section, and (b) collapsing other exposable content of another scrollable section of the view panel to make room for the first exposable content; and
receiving input corresponding to a selection of the particular heading bar associated with the particular scrollable section, the particular heading bar containing a particular heading and having associated therewith a partially-exposed area of the first exposable content other than the particular heading, and responsive to the selection input, fully exposing the first exposable content of the partially-exposed area.
2. The method of claim 1 , further including:
when the particular heading bar that is docked against the first end and the input corresponds to scrolling toward the second end, scrolling the scrollable section toward the second end while (a) exposing second exposable content of an adjoining scrollable section whose heading is docked against the first end, and (b) collapsing other exposable content of another scrollable section to make room for the second exposable content.
3. The method of claim 1 , further including responsive to receiving the input corresponding to scrolling the particular heading bar that is docked, applying a non-linear mapping to the speed at which the scrolling is displayed on the computing device.
4. The method of claim 1 , further including responsive to receiving the input corresponding to scrolling the particular heading bar that is docked, applying a nonlinear mapping to the speed at which the scrolling is displayed on the computing device that is faster during an initial scrolling than during an end of the scrolling.
5. The method of claim 1 , further including responsive to receiving the input corresponding to scrolling the particular heading bar that is docked, applying a logarithmic mapping to the speed at which the scrolling is displayed on the computing device.
6. A computer-implemented method, comprising:
displaying on a computing device a view panel having a first end and an opposing second end, wherein
the view panel displays scrollable sections,
the scrollable sections each include a heading bar and exposable content, the exposable content for a scrollable section appears between the heading bar and the second end when the exposable content is visible,
when a particular heading bar, which is any heading bar of the view panel, is docked on either the first end or the second end, no exposable content is visible between the particular heading bar and the end on which the particular heading bar is docked, and
the particular heading bar cannot scroll past a given end of the view panel without first becoming docked in a stack at the given end of the view panel;
receiving input corresponding to scrolling that causes the particular heading bar to change from being docked to being undocked;
responsive to the input, displaying an updated view panel, including
undocking and moving the particular heading bar away from the end on which the particular heading bar is docked,
making visible a first exposable content between the particular heading bar and an adjoining heading bar, and
at least partially collapsing a second exposable content on a side of the particular heading bar opposite the adjoining heading bar; and
receiving input corresponding to a selection of the heading bar associated with the particular scrollable section, the particular heading bar containing a particular heading and having associated therewith a partially-exposed area of the first exposable content other than the particular heading, and responsive to the selection input, fully exposing the first exposable content of the partially-exposed area.
7. The method of claim 6 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the first exposable content that becomes visible is associated with the adjoining heading bar.
8. The method of claim 6 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to a scroll movement that causes the particular heading bar to move away from the adjoining heading bar and to expose first exposable content associated with the adjoining heading bar.
9. The method of claim 6 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock and exposes content associated with the adjoining heading bar.
10. The method of claim 6 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock to a location that fully exposes content associated with the adjoining heading bar.
11. The method of claim 6 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock and move downward a minimum distance needed to fully expose content associated with the adjoining heading bar.
12. The method of claim 6 , wherein multiple heading bars are docked in a stack between the particular heading bar and the top of the view panel.
13. The method of claim 6 , wherein multiple heading bars are docked in a stack between the particular heading bar and both a top and a bottom of the view panel.
14. The method of claim 6 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked against the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the first exposable content that becomes visible is associated with the particular heading bar.
15. The method of claim 6 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked on the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the input corresponds to a scroll movement that causes the particular heading bar to move away from the adjoining heading bar and to expose first exposable content associated with the particular heading bar.
16. The method of claim 6 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked on the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the input corresponds to selection of the particular heading bar and the input causes the particular heading bar to undock and exposes content associated with the particular heading bar.
17. A non-transitory computer program product storing program instructions that, when executed on a computer, cause actions comprising:
displaying, on a computing device, a view panel having a first end and an opposing second end, the view panel displaying scrollable sections, wherein
each scrollable section includes a heading bar and exposable content, wherein the exposable content of a scrollable section, when visible, is situated between the heading bar and the second end,
when a particular heading bar, which is any heading bar of the view panel, is docked on either the first end or the second end, no exposable content is visible between the particular heading bar and the end on which the particular heading bar is docked, and
the particular heading bar cannot scroll past a given end of the view panel without first becoming docked in a stack at the given end of the view panel;
receiving input corresponding to scrolling the particular heading bar that is docked, the particular heading bar being associated with a particular scrollable section;
when the particular heading bar is docked against the second end and the input corresponds to scrolling the particular heading bar toward the first end, scrolling the particular heading bar toward the first end while (a) exposing first exposable content of the particular scrollable section, and (b) collapsing other exposable content of another scrollable section of the view panel to make room for the first exposable content; and
receiving input corresponding to a selection of the particular heading bar associated with the particular scrollable section, the particular heading bar containing a particular heading and having associated therewith a partially-exposed area of the first exposable content other than the particular heading, and responsive to the selection input, fully exposing the first exposable content of the partially-exposed area.
18. The method of claim 17 , further including:
when the particular heading bar that is docked against the first end and the input corresponds to scrolling toward the second end, scrolling the scrollable section toward the second end while (a) exposing second exposable content of an adjoining scrollable section whose heading is docked against the first end, and (b) collapsing other exposable content of another scrollable section to make room for the second exposable content.
19. A non-transitory computer program product storing program instructions that, when executed on a computer, cause actions comprising:
displaying on a computing device a view panel having a first end and an opposing second end, wherein
the view panel displays scrollable sections, the scrollable sections each include a heading bar and exposable content,
the exposable content for a scrollable section appears between the heading bar and the second end when the exposable content is visible,
when a particular heading bar, which is any heading bar of the vie panel, is docked on either the first end or the second end, no exposable content is visible between the particular heading bar and the end on which the particular heading bar is docked, and
the particular heading bar cannot scroll past a given end of the view panel without first becoming docked in a stack at the given end of the view panel;
receiving input corresponding to scrolling that causes the particular heading bar to change from being docked to being undocked;
responsive to the input, displaying an updated view panel, including
undocking and moving the particular heading bar away from the end on which the particular heading bar is docked,
making visible a first exposable content between the particular heading bar and an adjoining heading bar, and
at least partially collapsing a second exposable content on a side of the particular heading bar opposite the adjoining heading bar; and
receiving input corresponding to a selection of the particular heading bar associated with the particular scrollable section, the particular heading bar containing a particular heading and having associated therewith a partially-exposed area of the first exposable content other than the particular heading, and responsive to the selection input, fully exposing the first exposable content of the partially-exposed area.
20. The computer program product of claim 19 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the first exposable content that becomes visible is associated with the adjoining heading bar.
21. The computer program product of claim 19 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to a scroll movement that causes the particular heading bar to move away from the adjoining heading bar and to expose first exposable content associated with the adjoining heading bar.
22. The computer program product of claim 19 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock and exposes content associated with the adjoining heading bar.
23. The computer program product of claim 19 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock to a location that fully exposes content associated with the adjoining heading bar.
24. The computer program product of claim 19 , wherein:
the first end is a top of the view panel;
the adjoining heading bar is docked on the top of the view panel;
the particular heading bar is below the adjoining heading bar; and
the input corresponds to selection of the adjoining heading bar and the input causes the particular heading bar to undock and move downward a minimum distance needed to fully expose content associated with the adjoining heading bar.
25. The computer program product of claim 19 , wherein multiple heading bars are docked in a stack between the particular heading bar and the top of the view panel.
26. The computer program product of claim 19 , wherein multiple heading bars are docked in a stacks between the particular heading bar and both a top and a bottom of the view panel.
27. The computer program product of claim 19 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked against the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the first exposable content that becomes visible is associated with the particular heading bar.
28. The computer program product of claim 19 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked on the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the input corresponds to a scroll movement that causes the particular heading bar to move away from the adjoining heading bar and to expose first exposable content associated with the particular heading bar.
29. The computer program product of claim 19 , wherein:
the second end is a bottom of the view panel;
the adjoining heading bar is docked on the bottom of the view panel;
the particular heading bar is above the adjoining heading bar; and
the input corresponds to selection of the particular heading bar and the input causes the particular heading bar to undock and exposes content associated with the particular heading bar.
30. A computer-implemented method, comprising:
displaying, on a computing device, a view panel having a first end and an opposing second end, the view panel displaying scrollable sections, wherein
each scrollable section includes a heading bar and exposable content, wherein the exposable content of a scrollable section, when visible, is situated between the heading bar and the second end, and
when a particular heading bar, which is any heading bar of the view panel, is docked on either the first end or the second end, no exposable content is visible between the particular heading bar and the end on which the particular heading bar is docked;
receiving input corresponding to scrolling a first particular heading bar that is docked, the particular heading bar being associated with a particular scrollable section of the view panel;
when the particular heading bar is docked against the second end and the input corresponds to scrolling the particular heading bar toward the first end, scrolling the particular heading bar toward the first end while (a) exposing particular exposable content of the particular scrollable section, and (b) collapsing other exposable content of another scrollable section of the view panel to make room for the particular exposable content;
responsive to receiving the input corresponding to scrolling the particular heading bar that is docked, applying a non-linear mapping to the speed at which the scrolling is displayed on the computing device; and
receiving input corresponding to a selection of the particular heading bar associated with the particular scrollable section, the particular heading bar containing a particular heading and having associated therewith a partially-exposed area of the particular exposable content other than the particular heading, and responsive to the selection input, fully exposing the particular exposable content of the partially-exposed area associated with the particular heading bar.