码迷,mamicode.com
首页 > 移动开发 > 详细

Android 学习笔记(7)——ScrollView(竖直滚动条)/HorizontalScrollView(水平滚动条)

时间:2016-02-22 11:57:08      阅读:321      评论:0      收藏:0      [点我收藏+]

标签:

作者:夏至  欢迎转载,也请保留这段申明,谢谢

    有没有发现,我们以前的学习都是用在一个手机屏幕框里的,没有上下滑动的?如果我们增加内容好像会被覆盖?没错,这次我们就来解决这个问题,让你像浏览网页一样,刷刷刷。。。。
                                    技术分享
当然,我们还要增加两个按键,一个返回顶部,一个跳到底部。这样是不是就像网页一样了。这里的布局,我们要说一下,因为linearlayout是包裹在scrollview里面的。这点要注意一下。
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
  3. android:layout_width="match_parent"
  4. android:layout_height="match_parent"
  5. android:id="@+id/scrollView">
  6. <LinearLayout
  7. android:layout_width="match_parent"
  8. android:layout_height="match_parent"
  9. android:orientation="vertical" >
  10. <Button
  11. android:id="@+id/bottom"
  12. android:layout_width="match_parent"
  13. android:layout_height="wrap_content"
  14. android:textSize="24sp"
  15. android:text="跳到底部"
  16. />
  17. <TextView
  18. android:layout_width="match_parent"
  19. android:layout_height="wrap_content"
  20. android:text="实现翻滚效果"
  21. android:textSize="24sp"
  22. />
  23. <ImageView
  24. android:layout_width="wrap_content"
  25. android:layout_height="wrap_content"
  26. android:src="@drawable/image1"
  27. />
  28. <ImageView
  29. android:layout_width="wrap_content"
  30. android:layout_height="wrap_content"
  31. android:scaleType="fitCenter"
  32. android:src="@drawable/image2"
  33. />
  34. <ImageView
  35. android:layout_width="wrap_content"
  36. android:layout_height="wrap_content"
  37. android:scaleType="fitCenter"
  38. android:src="@drawable/shaorui"
  39. />
  40. <ImageView
  41. android:layout_width="wrap_content"
  42. android:layout_height="wrap_content"
  43. android:scaleType="fitCenter"
  44. android:src="@drawable/start"
  45. />
  46. <ImageView
  47. android:layout_width="wrap_content"
  48. android:layout_height="wrap_content"
  49. android:scaleType="fitCenter"
  50. android:src="@drawable/stop"
  51. />
  52. <Button
  53. android:id="@+id/top"
  54. android:layout_width="match_parent"
  55. android:layout_height="wrap_content"
  56. android:textSize="24sp"
  57. android:text="回到顶部"
  58. />
  59. </LinearLayout>
  60. </ScrollView>


如果用eclipse的话,可以新建一个xml文件,让它是scrollview即可,如果是studio的话,就老老实实的写吧。

好,接下来就是写主活动的程序了。这里的scrollview有连个方法可用。
我们可以直接利用ScrollView给我们提供的:fullScroll()方法:
    ·scrollView.fullScroll(ScrollView.FOCUS_DOWN);滚动到底部
    ·scrollView.fullScroll(ScrollView.FOCUS_UP);滚动到顶部
  1. public class MainActivity extends AppCompatActivity implements View.OnClickListener {
  2. private ScrollView scrollView;
  3. @Override
  4. protected void onCreate(Bundle savedInstanceState) {
  5. super.onCreate(savedInstanceState);
  6. setContentView(R.layout.linearlayout);
  7. Button top = (Button) findViewById(R.id.top);
  8. Button bottom = (Button) findViewById(R.id.bottom);
  9. scrollView = (ScrollView) findViewById(R.id.scrollView);
  10. top.setOnClickListener(this);
  11. bottom.setOnClickListener(this);
  12. }
  13. @Override
  14. public void onClick(View v) {
  15. switch (v.getId()) {
  16. case R.id.top:
  17. scrollView.fullScroll(ScrollView.FOCUS_UP);
  18. break;
  19. case R.id.bottom:
  20. scrollView.fullScroll(ScrollView.FOCUS_DOWN);
  21. break;
  22. }
  23. }

快去实践一下吧。
技术分享技术分享

这里再扩充一下水平方向的。HorizontalScrollView,再把linearlayout 的方向改成水平,其他的都不变.
  1. <HorizontalScrollView
  2.     xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content"
  5.     android:id="@+id/scrollView">
  6. <LinearLayout
  7.     android:layout_width="match_parent"
  8.     android:layout_height="match_parent"
  9.     android:orientation="horizontal" >
  10. .....

当然了,MainActivity那里我们也要修改一下。就是把ScrollView 全部替换 HorizontalScrollView 即可。
效果如图:
  1. public class MainActivity extends AppCompatActivity implements View.OnClickListener {
  2. private HorizontalScrollView horizontalScrollView;
  3. @Override
  4. protected void onCreate(Bundle savedInstanceState) {
  5. super.onCreate(savedInstanceState);
  6. setContentView(R.layout.linearlayout);
  7. Button top = (Button) findViewById(R.id.top);
  8. Button bottom = (Button) findViewById(R.id.bottom);
  9. horizontalScrollView = (HorizontalScrollView) findViewById(R.id.scrollView);
  10. top.setOnClickListener(this);
  11. bottom.setOnClickListener(this);
  12. }
  13. @Override
  14. public void onClick(View v) {
  15. switch (v.getId()) {
  16. case R.id.top:
  17. horizontalScrollView.fullScroll(HorizontalScrollView.FOCUS_UP);
  18. break;
  19. case R.id.bottom:
  20. horizontalScrollView.fullScroll(HorizontalScrollView.FOCUS_DOWN);
  21. break;
  22. }
  23. }

    技术分享技术分享

效果丑到杠杠的,自行修改布局把。
如有错误,欢迎指出,如果喜欢,欢迎收藏!















Android 学习笔记(7)——ScrollView(竖直滚动条)/HorizontalScrollView(水平滚动条)

标签:

原文地址:http://www.cnblogs.com/shaorui/p/5206597.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!