AnalogClock, DigitalClock và TextClock
Trong Android, AnalogClock là dạng một đồng hồ kim, hiển thị thời gian chính bằng kim, kim ngắn chỉ giờ, kim dài chỉ chỉ số phút. DigitalClock & TextClock cả hai trông giống như đồng hồ kỹ thuật số bình thường. Nó hiển thị giờ, phút và giây.
Android AnalogClock là lớp con của lớp View, Android DigitalClock là lớp con của lớp TextView.
Sau Android API 17 nên sử dụng TextClock. Trong android, bạn cần kéo đồng hồ analog và kỹ thuật số từ các pallet để hiển thị đồng hồ analog và kỹ thuật số. Nó đại diện cho thời gian của các thiết bị hiện nay.
Các loại đồng hồ trong Android
Analog Clock:
AnalogClock là dạng một đồng hồ kim, hiển thị thời gian chính bằng kim, kim ngắn chỉ giờ, kim dài chỉ chỉ số phút.
AnalogClock code trong XML
<AnalogClock android:id="@+id/simpleAnalogClock" android:layout_width="wrap_content" android:layout_height="wrap_content" />
Digital Clock:
DigitalClock trông giống như đồng hồ kỹ thuật số bình thường. Nó hiển thị giờ, phút và giây. Nó chỉ sử dụng từ API 17 trở về trước
DigitalClock code trong XML
<TextClock android:id="@+id/simpleTextClock" android:layout_width="wrap_content" android:layout_height="wrap_content" />
Text Clock:
Giống như DigitalClock nhưng nó sử dụng từ API 17 trở về sau.
<TextClock android:id="@+id/simpleTextClock" android:layout_width="wrap_content" android:layout_height="wrap_content" />
Một số thuộc tính thường dùng của AnalogClock
1. android:id: Là thuộc tính duy nhất của AnalogClock.
<AnalogClock android:id="@+id/simpleAnalogClock" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <!-- id attribute of a analog clock used to uniquely identify it -->
Dựa vào Id ta sẽ lấy được control theo đúng Id này, xem code bên dưới để biết cách lấy control theo Id:
AnalogClock simpleAnalogClock = (AnalogClock) findViewById(R.id.simpleAnalogClock);
3. android:background: Thuộc tính này thiết lập màu nền AnalogClock
Code sau chúng ta thiết lập màu nền, màu đỏ cho AnalogClock
<AnalogClock android:id="@+id/simpleAnalogClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="#f00"/>
Thiết lập màu nên trong java class
AnalogClock simpleAnalogClock = (AnalogClock)findViewById(R.id.simpleAnalogClock); // inititate a analog clock simpleAnalogClock.setBackgroundColor(Color.GREEN); // green color for the background of the analog clock
Một số thuộc tính thường dùng của DigitalClock hoặc TextClock
1. android:padding: Thuộc tính này xác định khoảng cách từ đường viền của DigitalClock với nội dung nó chứa: left, right, top or bottom. Cũng ví dụ trên bây giờ chúng ta xác định padding=40dp từ mọi phía cho DigitalClock.
<DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:background="#0f0" android:padding="40dp"/><!-- Thiết lập padding=40dp -->
2. android:gravity: Thuộc tính này thường sử dụng để canh nội dung trên TextView: left, right, center, top, bottom, center_vertical, center_horizontal
Ví dụ sau chúng ta thiết lập hiển thị đồng hồ phía bên phải
<DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:textSize="25sp" android:padding="20dp" android:gravity="right"/>
3. android:textColor: Thuộc tính này dùng xác định màu chữ hiển thị của đồng hồ, dạng màu chữ: “#argb”, “#rgb”, “#rrggbb”, hoặc “#aarrggbb”.
<DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:textSize="25sp" android:padding="20dp" android:textColor="#f00"/>
Thiết lập màu nên trong Java Class
DigitalClock simpleDigitalClock = (DigitalClock)findViewById(R.id.simpleDigitalClock); // initiate a digital clock simpleDigitalClock.setTextColor(Color.RED); // Hiển thị màu đỏ
4. android:textSize: Thuộc tính textSize xác định kích thước văn bản của DigitalClock. Chúng ta có thể đ8ạ kích thước văn bản theo sp(scale independent pixel) hoặc dp(density pixel). Trong ví dụ này chúng ta xác định kích thước cho văn bản là 40sp.
<DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:padding="20dp" android:textSize="40sp" /> <!-- thiết lập textsize=40dp -->
Thiết lập thuộc tính textSize trong Java class
DigitalClock simpleDigitalClock = (DigitalClock)findViewById(R.id.simpleDigitalClock); // initiate a digital clock simpleDigitalClock.setTextSize(25); // Thiết lập kích thước text
5. android: textStyle: Thuộc tính xác định loại văn bản của DigitalClock, thông thường có các loại văn bản:bold, italic và normal. Nếu chúng ta muốn sử nhiều hơn một loại văn bản thì phải thêm phép toán hoặc "|" vào giữa các loại văn bản:
Ví dụ sau chúng ta thiết lập kiểu chữ của DigitalClock là bold và italic.
<DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:padding="20dp" android:textSize="25sp" android:textStyle="bold|italic" />
Ví dụ: Trong ví dụ này chúng ta sẽ làm ứng dụng gồm có một AnalogClock, một DigitalClock và 2 TextView. Thiết lập sự kiện cho 2 clock, khi người sử dụng click vào sẽ hiển thị thông qua Toast. Tiến hành tạo project, vào thư mục res /layout -> activity_main.xml thiết kế giao diện sau:
Bước 1: Tạo một project tên là DatePickerDialog: File->New->Android Application Project điền các thông tin ->Next ->Finish
Bước 2: Mở res -> values -> strings.xml
<resources> <string name="app_name">AnalogAndDigitalClock</string> <string name="hello_world">Hello world!</string> <string name="action_settings">Settings</string> <string name="analogClock">Analog Clock</string> <string name="digitalClock" >Digital Clock</string> </resources>
Bước 3: Mở res -> layout -> xml (hoặc) activity_main.xml và thêm code, chúng ta sẽ tạo các đối tượng EditText trong Relative Layout.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context=".MainActivity"> <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:text="@string/analogClock" android:textSize="25sp" android:textStyle="bold" /> <AnalogClock android:id="@+id/simpleAnalogClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_marginTop="50dp" android:background="#0f0" android:padding="50dp" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/simpleAnalogClock" android:layout_centerHorizontal="true" android:layout_marginTop="50dp" android:text="@string/digitalClock" android:textSize="25sp" android:textStyle="bold" /> <DigitalClock android:id="@+id/simpleDigitalClock" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/textView2" android:layout_centerHorizontal="true" android:layout_marginTop="20dp" android:background="#0f0" android:padding="20dp" android:textColor="#fff" android:textStyle="bold" /> </RelativeLayout>
Bước 5: Mở app -> src ->MainActivity.java và thêm code.
Trong bước này chúng ta khởi tạo cho 2 clock và thiết lập sự kiện cho chúng. Khi người sử dụng Click vào Clock sẽ hiện tên Clock thông qua Toast
package hiepsiit.com.calendarview; import android.app.Activity; import android.graphics.Color; import android.os.Bundle; import android.view.Menu; import android.view.MenuItem; import android.widget.CalendarView; import android.widget.Toast; public class MainActivity extends Activity { CalendarView simpleCalendarView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); simpleCalendarView = (CalendarView) findViewById(R.id.simpleCalendarView); // get the reference of CalendarView simpleCalendarView.setFocusedMonthDateColor(Color.RED);// set the red color for the dates of focused month simpleCalendarView.setUnfocusedMonthDateColor(Color.BLUE); // set the yellow color for the dates of an unfocused month simpleCalendarView.setSelectedWeekBackgroundColor(Color.RED); // Thiết lập màu đỏ cho các tuần, Từ API 23 trở lên mới hỗ trợ simpleCalendarView.setWeekSeparatorLineColor(Color.GREEN); // Thiết lập cho đường khoảng cách giữa các tuần là màu xanh // perform setOnDateChangeListener event on CalendarView simpleCalendarView.setOnDateChangeListener(new CalendarView.OnDateChangeListener() { @Override public void onSelectedDayChange(CalendarView view, int year, int month, int dayOfMonth) { // display the selected date by using a toast Toast.makeText(getApplicationContext(), dayOfMonth + "/" + month + "/" + year, Toast.LENGTH_LONG).show(); } }); } }
Ứng dụng này được phát triển bởi adt bundle, android 4.2 sử dụng minimum sdk 11 and target sdk 21.
Kết quả khi chạy ứng dụng:
Sau đó chọn giờ:
Cập nhật công nghệ từ Youtube tại link: https://www.youtube.com/channel/UCOxeYcvZPGf-mGLYSl_1LuA/videos
Để tham gia khóa học công nghệ truy cập link: http://thuvien.hocviendaotao.com
Mọi hỗ trợ về công nghệ email: dinhanhtuan68@gmail.com