Computer >> Máy Tính >  >> Lập trình >> Android

Làm thế nào để tạo CircularImageView trong Android?

Ví dụ này trình bày về cách Tạo CircularImageView trong android.

Bước 1 - Tạo một dự án mới trong Android Studio, đi tới Tệp ⇒ Dự án Mới và điền tất cả các chi tiết cần thiết để tạo một dự án mới.

Bước 2 −Để tạo chế độ xem vòng tròn, chúng ta nên thêm thư viện CircularImageView trong tệp gradle như hình dưới đây. 

apply plugin: 'com.android.application'
android {
   compileSdkVersion 28
   defaultConfig {
      applicationId "com.example.andy.myapplication"
      minSdkVersion 15
      targetSdkVersion 28
      versionCode 1
      versionName "1.0"
      testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
   }
   buildTypes {
      release {
         minifyEnabled false
         proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
      }
   }
}
dependencies {
   implementation fileTree(dir: 'libs', include: ['*.jar'])
   implementation 'com.android.support:appcompat-v7:28.0.0'
   implementation 'com.android.support.constraint:constraint-layout:1.1.3'
   testImplementation 'junit:junit:4.12'
   androidTestImplementation 'com.android.support.test:runner:1.0.2'
   implementation 'com.mikhaellopez:circularimageview:3.2.0'
   androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

Bước 3 - Sau đây là nội dung của tệp hoạt động chính MainActivity.java đã được sửa đổi. Tệp này có thể bao gồm từng phương pháp cơ bản của vòng đời. Chúng tôi đã tạo Chế độ xem hình tròn trong activity_main.xml 

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }
}

Bước 4 - Sau đây sẽ là nội dung của tệp res / layout / activity_main.xml để bao gồm một CircularImageView . 

<?xml version = "1.0" encoding = "utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android = "https://schemas.android.com/apk/res/android"
xmlns:app = "https://schemas.android.com/apk/res-auto"
   xmlns:tools = "https://schemas.android.com/tools"
   android:layout_width = "match_parent"
   android:layout_height = "match_parent"
   tools:context = ".MainActivity">
<LinearLayout
   android:layout_width = "match_parent"
   android:gravity = "center_horizontal"
   android:orientation = "vertical"
   android:layout_height = "match_parent">
   <com.mikhaellopez.circularimageview.CircularImageView
      android:layout_width = "250dp"
      android:layout_height = "250dp"
      android:src = "@drawable/image"
      app:civ_border_color = "#EEEEEE"
      app:civ_border_width = "4dp"
      app:civ_shadow = "true"
      app:civ_shadow_radius = "10"
      app:civ_shadow_color = "#8BC34A"/>
   <TextView
      android:text = "Mohammad Mohtashim"
      android:layout_width = "match_parent"
      android:layout_height = "match_parent"
      android:layout_marginTop = "20dp"
      android:textSize = "20sp"
      android:textAlignment = "center"/>
</LinearLayout>
</android.support.constraint.ConstraintLayout>

Bố cục ở trên chúng ta đã khai báo CircularImageView là com.mikhaellopez.circularimageview.CircularImageView và thêm hình ảnh từ drawable dưới dạng id là image.

Hãy thử chạy ứng dụng của bạn. Tôi giả sử bạn đã kết nối thiết bị Di động Android thực tế với máy tính của mình. Để chạy ứng dụng từ android studio, hãy mở một trong các tệp hoạt động của dự án của bạn và nhấp vào biểu tượng Chạy từ thanh công cụ. Chọn thiết bị di động của bạn làm tùy chọn, sau đó kiểm tra thiết bị di động sẽ hiển thị màn hình mặc định của bạn -

Làm thế nào để tạo CircularImageView trong Android?

Thuộc tính của CircularImageView

  • ứng dụng:civ_border - Thuộc tính này được sử dụng để tạo đường viền và giá trị mặc định là true

  • ứng dụng:civ_border_color - Thuộc tính này được sử dụng để tạo màu viền và màu mặc định là màu trắng

  • ứng dụng:civ_border_width - Thuộc tính này được sử dụng để tạo chiều rộng đường viền và giá trị mặc định là 4dp

  • ứng dụng:civ_background_color - Thuộc tính này được sử dụng để tạo màu nền và màu nền mặc định là màu trắng

  • ứng dụng:civ_shadow - Thuộc tính này dùng để tạo bóng cho hình ảnh và giá trị mặc định là false, nếu cần đổ bóng chúng ta cần tạo bóng cho đúng

  • ứng dụng:civ_shadow_color - Thuộc tính này dùng để tạo màu bóng cho ảnh và giá trị mặc định là màu đen

  • ứng dụng:civ_shadow_radius - Thuộc tính này dùng để tạo bán kính bóng cho hình ảnh và giá trị mặc định là 8.0f

  • ứng dụng:civ_shadow_gravity - Thuộc tính này được sử dụng để tạo trọng lực đổ bóng cho hình ảnh và giá trị mặc định là dưới cùng.