图像显示

图像视图ImageView

cbdfff488a69caad.png

效果图：

fb9ce9a1131c1294.png

代码演示:

activity_image_scale.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    
    <ImageView
        android:id="@+id/iv_scale"
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/apple"
        />
 

</LinearLayout>

java代码中(设置图片时请将xml中android:src=”@drawable/apple” 改为注释)

1
<!--android:src="@drawable/apple" -->

ImageScaleActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
package com.luowen.chapter03;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ImageView;

public class ImageScaleActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_scale);
      ImageView iv_scale = findViewById(R.id.iv_scale);
      iv_scale.setImageResource(R.drawable.apple);
    }
}

图像视图的缩放形式

c2af75d54c54a3b7.png

默认值时fitCenter

效果图

0615b1e1158236e3.png

代码演示:activity_image_scale.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    
    <ImageView
        android:id="@+id/iv_scale"
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:layout_marginTop="5dp"
        android:src="@drawable/apple"
        android:scaleType="center"
        />


</LinearLayout>

ImageScaleActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
package com.luowen.chapter03;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.widget.ImageView;

public class ImageScaleActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_scale);
      ImageView iv_scale = findViewById(R.id.iv_scale);
      iv_scale.setImageResource(R.drawable.apple);
      iv_scale.setScaleType(ImageView.ScaleType.CENTER);
    }
}

图像按钮ImageButton

991875df16086abc.png

70c3a5d572d132b6.png

效果图：

b5f52f81d9f2f3ef.png

代码演示

activity_image_button.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    
    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:src="@drawable/sqrt"
        android:scaleType="fitCenter"
        />
    <!--android:foreground="" 设置前景 对应 background -->

</LinearLayout>

ImageButtonActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
package com.luowen.chapter03;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class ImageButtonActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_button);
    }
}

同时展示文字与图片

3e7f2c5533b25d04.png

效果图：

120a91311ac7fa11.png

代码演示：

activity_image_text.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="图标在上"
        android:drawableTop="@drawable/ic_about"
        android:gravity="center"
        android:textSize="18sp"
        android:background="#FFFFFF"
        android:padding="5dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="图标在下"
        android:drawableBottom="@drawable/ic_about"
        android:gravity="center"
        android:textSize="18sp"
        android:background="#FFFFFF"
        android:padding="5dp"/>

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="图标在左"
        android:drawableLeft="@drawable/ic_about"
        android:gravity="center"
        android:textSize="18sp"
        android:background="#FFFFFF"
        android:padding="5dp"/>
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="图标在右"
        android:drawableRight="@drawable/ic_about"
        android:gravity="center"
        android:textSize="18sp"
        android:background="#FFFFFF"
        android:padding="5dp"/>


</LinearLayout>

ImageButtonActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
package com.luowen.chapter03;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class ImageButtonActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_button);
    }
}