Android实现滑动刻度尺效果,选择身高体重和生日
刻度尺效果虽然看起来很美,我个人认为很不实用,即使再不实用,也有用的,鉴于群里成员对我的苦苦哀求,我就分享一个他用不到的,横屏滑动刻度尺,因为他需要竖屏的,哈哈……
最近群里的开发人员咨询怎样实现刻度尺的滑动效果去选择身高体重等信息。我倒是做过这种效果,貌似群里要的那个开发者要竖着的刻度尺,那我就先分享个横着的刻度尺滑动选择效果。哈哈……我就是这么贱,贱贱的才惹人爱嘛!好了,不逗了,先给个横着的效果,自己试着去改编或者修改一下,看看通过自己的能力能不能做出竖着的效果来,过两天我再把竖着的那个滑动选择效果分享出来。废话不多说了,上代码。
效果图:
第一步:activity_mian.xml布局:
1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 2 xmlns:tools="http://schemas.android.com/tools" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" 5 android:background="@color/tab_blue" 6 android:gravity="center_vertical" 7 android:orientation="vertical" 8 tools:context=".MainActivity" > 9 10 <RelativeLayout 11 android:layout_width="fill_parent" 12 android:layout_height="wrap_content" 13 android:layout_marginBottom="10dp" 14 android:layout_marginLeft="15dp" 15 android:layout_marginRight="15dp" 16 android:layout_marginTop="10dp" > 17 18 <LinearLayout 19 android:id="@+id/two" 20 android:layout_width="wrap_content" 21 android:layout_height="wrap_content" 22 android:layout_centerVertical="true" 23 android:orientation="vertical" > 24 25 <TextView 26 android:layout_width="wrap_content" 27 android:layout_height="wrap_content" 28 android:layout_gravity="center_horizontal" 29 android:text="出生年" 30 android:textColor="@color/white" 31 android:textSize="16sp" /> 32 33 <TextView 34 android:id="@+id/user_birth_value" 35 android:layout_width="wrap_content" 36 android:layout_height="wrap_content" 37 android:layout_gravity="center_horizontal" 38 android:layout_marginTop="5dp" 39 android:text="1972" 40 android:textColor="@color/white" 41 android:textSize="18sp" 42 android:textStyle="bold" /> 43 </LinearLayout> 44 45 <HorizontalScrollView 46 android:id="@+id/birthruler" 47 android:layout_width="fill_parent" 48 android:layout_height="60dp" 49 android:layout_centerVertical="true" 50 android:layout_marginLeft="5dp" 51 android:layout_toRightOf="@id/two" 52 android:background="@drawable/birthday_ruler" 53 android:scrollbars="none" > 54 55 <LinearLayout 56 android:id="@+id/ruler_layout" 57 android:layout_width="wrap_content" 58 android:layout_height="fill_parent" 59 android:gravity="center_vertical" 60 android:orientation="horizontal" > 61 </LinearLayout> 62 </HorizontalScrollView> 63 </RelativeLayout> 64 65 </LinearLayout>
第二步:水平空白刻度布局,blankhrulerunit.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="100dp" android:layout_height="fill_parent" android:layout_marginBottom="20dp" android:background="@null" android:orientation="vertical" > <TextView android:id="@+id/hrulerunit" android:layout_width="100dp" android:layout_height="20dp" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:background="@null" android:textColor="@color/white" android:textSize="14sp" /> </RelativeLayout>
第三步:中间刻度尺布局,hrulerunit.xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="20dp" android:orientation="vertical" > <ImageView android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_marginBottom="25dp" android:layout_marginTop="3dp" android:background="@null" android:contentDescription="@null" android:scaleType="fitXY" android:src="@drawable/rulerscale_horizontal" /> <TextView android:id="@+id/hrulerunit" android:layout_width="wrap_content" android:layout_height="20dp" android:layout_alignParentBottom="true" android:layout_alignParentLeft="true" android:background="@null" android:textColor="@color/white" android:textSize="14sp" /> </RelativeLayout>
第四步:MainActivity.java主代码实现:
1 package net.loonggg.rulerdemo; 2 3 import java.text.ParseException; 4 import java.text.SimpleDateFormat; 5 import java.util.Date; 6 7 import android.app.Activity; 8 import android.os.Bundle; 9 import android.os.Handler; 10 import android.view.LayoutInflater; 11 import android.view.MotionEvent; 12 import android.view.View; 13 import android.view.View.OnTouchListener; 14 import android.view.ViewGroup.LayoutParams; 15 import android.widget.HorizontalScrollView; 16 import android.widget.LinearLayout; 17 import android.widget.TextView; 18 19 public class MainActivity extends Activity { 20 private HorizontalScrollView ruler; 21 private LinearLayout rulerlayout, all_layout; 22 private TextView user_birth_value; 23 private int beginYear; 24 25 private String birthyear = "1970"; 26 private long time = 0; 27 private int screenWidth; 28 private boolean isFirst = true; 29 30 @Override 31 protected void onCreate(Bundle savedInstanceState) { 32 super.onCreate(savedInstanceState); 33 setContentView(R.layout.activity_main); 34 user_birth_value = (TextView) findViewById(R.id.user_birth_value); 35 user_birth_value.setText("1970"); 36 ruler = (HorizontalScrollView) findViewById(R.id.birthruler); 37 rulerlayout = (LinearLayout) findViewById(R.id.ruler_layout); 38 ruler.setOnTouchListener(new OnTouchListener() { 39 40 @Override 41 public boolean onTouch(View v, MotionEvent event) { 42 int action = event.getAction(); 43 user_birth_value.setText(String.valueOf(beginYear 44 + (int) Math.ceil((ruler.getScrollX()) / 20))); 45 switch (action) { 46 case MotionEvent.ACTION_DOWN: 47 case MotionEvent.ACTION_MOVE: 48 break; 49 case MotionEvent.ACTION_UP: 50 new Handler().postDelayed(new Runnable() { 51 @Override 52 public void run() { 53 user_birth_value.setText(String.valueOf(beginYear 54 + (int) Math.ceil((ruler.getScrollX()) / 20))); 55 birthyear = String.valueOf((int) (beginYear + Math 56 .ceil((ruler.getScrollX()) / 20))); 57 try { 58 time = (new SimpleDateFormat("yyyy") 59 .parse(String.valueOf(birthyear))) 60 .getTime(); 61 } catch (ParseException e) { 62 e.printStackTrace(); 63 } 64 } 65 }, 1000); 66 break; 67 } 68 return false; 69 } 70 71 }); 72 } 73 74 @Override 75 public void onWindowFocusChanged(boolean hasFocus) { 76 super.onWindowFocusChanged(hasFocus); 77 if (isFirst) { 78 screenWidth = ruler.getWidth(); 79 constructRuler(); 80 isFirst = false; 81 } 82 } 83 84 @Override 85 protected void onResume() { 86 super.onResume(); 87 new Handler().postDelayed(new Runnable() { 88 @Override 89 public void run() { 90 scroll(); 91 } 92 }, 100); 93 } 94 95 private void scroll() { 96 ruler.smoothScrollTo((1970 - beginYear) * 20, 0); 97 } 98 99 @SuppressWarnings("deprecation") 100 private void constructRuler() { 101 int year = new Date().getYear(); 102 if (year < 2015) 103 year = 2010; 104 beginYear = year / 10 * 10 - 150; 105 View leftview = (View) LayoutInflater.from(this).inflate( 106 R.layout.blankhrulerunit, null); 107 leftview.setLayoutParams(new LayoutParams(screenWidth / 2, 108 LayoutParams.MATCH_PARENT)); 109 rulerlayout.addView(leftview); 110 for (int i = 0; i < 16; i++) { 111 View view = (View) LayoutInflater.from(this).inflate( 112 R.layout.hrulerunit, null); 113 view.setLayoutParams(new LayoutParams(200, 114 LayoutParams.MATCH_PARENT)); 115 TextView tv = (TextView) view.findViewById(R.id.hrulerunit); 116 tv.setText(String.valueOf(beginYear + i * 10)); 117 rulerlayout.addView(view); 118 } 119 View rightview = (View) LayoutInflater.from(this).inflate( 120 R.layout.blankhrulerunit, null); 121 rightview.setLayoutParams(new LayoutParams(screenWidth / 2, 122 LayoutParams.MATCH_PARENT)); 123 rulerlayout.addView(rightview); 124 } 125 126 }
索要源码的方式很简单,跟以前一样,在公众号“非著名程序员”里回复关键字“刻度尺”即可获得。欢迎大家关注,转发和分享。
非著名程序员可能是东半球最好的技术分享公众号。每天,每周定时推送一些有关移动开发的原创文章和教程,微信号:smart_android。