Android App开发图像加工中卡片视图CardView和给图像添加装饰的讲解以及实战(附源码 简单易懂)

简介: Android App开发图像加工中卡片视图CardView和给图像添加装饰的讲解以及实战(附源码 简单易懂)

需要图片集和源码请点赞关注收藏后评论区留言~~~

一、卡片视图

随着手机越来越先进,开发者已经不满足简单地显示一张张图片,而要设计更多的花样,比如Android提供了一个卡片视图CardView,顾名思义它拥有卡片式的圆角边框,边框外缘有一圈阴影,边框内缘有一圈空白 使用卡片视图前要先修改build.gradle 引入以下依赖

implementation 'androidx.cardview:cardview:1.0.0'

常用方法如下

1:cardBackgroundColor 设置卡片边框的背景颜色

2:cardCornerRadius  设置卡片边框的圆角半径

3:cardElevation  设置卡片边缘的阴影高程

4:contentPadding  设置卡片边框的间隔

效果如下

可以调整圆角与阴影大小,改变视图效果。下拉框中可以选择

代码如下

Java类

package com.example.picture;
import androidx.appcompat.app.AppCompatActivity;
import androidx.cardview.widget.CardView;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup.MarginLayoutParams;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import com.example.picture.util.Utils;
public class CardViewActivity extends AppCompatActivity {
    private CardView cv_card; // 声明一个卡片视图对象
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_card_view);
        cv_card = findViewById(R.id.cv_card);
        initCardSpinner(); // 初始化卡片类型下拉框
    }
    // 初始化卡片类型下拉框
    private void initCardSpinner() {
        ArrayAdapter<String> cardAdapter = new ArrayAdapter<>(this,
                R.layout.item_select, cardArray);
        Spinner sp_card = findViewById(R.id.sp_card);
        sp_card.setPrompt("请选择卡片类型");
        sp_card.setAdapter(cardAdapter);
        sp_card.setOnItemSelectedListener(new CardSelectedListener());
        sp_card.setSelection(0);
    }
    private String[] cardArray = {"圆角与阴影均为3", "圆角与阴影均为6", "圆角与阴影均为10",
            "圆角与阴影均为15", "圆角与阴影均为20"};
    private int[] radiusArray = {3, 6, 10, 15, 20};
    class CardSelectedListener implements AdapterView.OnItemSelectedListener {
        public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
            int radius = Utils.dip2px(CardViewActivity.this, radiusArray[arg2]);
            cv_card.setRadius(radius); // 设置卡片视图的圆角半径
            cv_card.setCardElevation(radius); // 设置卡片视图的阴影长度
            MarginLayoutParams params = (MarginLayoutParams) cv_card.getLayoutParams();
            // 设置布局参数的四周空白
            params.setMargins(radius, radius, radius, radius);
            cv_card.setLayoutParams(params); // 设置卡片视图的布局参数
        }
        public void onNothingSelected(AdapterView<?> arg0) {}
    }
}

XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:orientation="horizontal">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:gravity="center"
            android:paddingLeft="5dp"
            android:text="卡片视图样式:"
            android:textColor="@color/black"
            android:textSize="17sp" />
        <Spinner
            android:id="@+id/sp_card"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:spinnerMode="dialog" />
    </LinearLayout>
    <androidx.cardview.widget.CardView
        android:id="@+id/cv_card"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal|top"
        app:cardCornerRadius="3dp"
        app:cardElevation="3dp"
        app:contentPadding="20dp">
        <ImageView
            android:id="@+id/iv_scene"
            android:layout_width="wrap_content"
            android:layout_height="250dp"
            android:src="@drawable/ylxs" />
    </androidx.cardview.widget.CardView>
</LinearLayout>

二、给图像添加装饰

虽然原样图片能够满足多数场合,但是有时需要给图片添加一些小装饰,比如添加图片边框,添加文字水印,添加图标水印等等,一般是利用画布工具Canvas来绘制图案,具体细节结合画笔工具Paint即可 Canvas常用方法如下

drawarc 绘制扇形或者弧形

drawBitmap 绘制位图

drawCircle 绘制圆形

drawLine 绘制直线

drawOval 绘制椭圆

drawPath 绘制路径

drawPoint 绘制点

drawRect 绘制矩形

drawRoundRect 绘制圆角矩形

drawText 绘制文字

效果如下

无装饰风格如下

添加了时间戳装饰如下

添加边框效果如下

代码如下

Java类

package com.example.picture;
import androidx.appcompat.app.AppCompatActivity;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import com.example.picture.util.DateUtil;
import com.example.picture.widget.DecorateImageView;
public class ImageDecorateActivity extends AppCompatActivity {
    private DecorateImageView div_scene; // 声明一个装饰视图对象
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_image_decorate);
        div_scene = findViewById(R.id.div_scene);
        initDecorateSpinner(); // 初始化装饰类型下拉框
    }
    // 初始化装饰类型下拉框
    private void initDecorateSpinner() {
        ArrayAdapter<String> decorateAdapter = new ArrayAdapter<>(this,
                R.layout.item_select, decorateNameArray);
        Spinner sp_decorate = findViewById(R.id.sp_decorate);
        sp_decorate.setPrompt("请选择装饰类型");
        sp_decorate.setAdapter(decorateAdapter);
        sp_decorate.setOnItemSelectedListener(new DecorateSelectedListener());
        sp_decorate.setSelection(0);
    }
    private String[] decorateNameArray = {"无装饰", "时间戳装饰", "标志图装饰", "相框装饰"};
    class DecorateSelectedListener implements AdapterView.OnItemSelectedListener {
        public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
            if (arg2 == 0) { // 无装饰
                div_scene.showNone(); // 不显示任何装饰
            } else if (arg2 == 1) { // 时间戳装饰
                String text = DateUtil.getNowFullDateTime();
                div_scene.showText(text, true); // 显示装饰文本
            } else if (arg2 == 2) { // 标志图装饰
                Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.flower_lotus);
                div_scene.showLogo(bitmap, true); // 显示装饰标志
            } else if (arg2 == 3) { // 相框装饰
                Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.photo_frame1);
                div_scene.showFrame(bitmap, true); // 显示装饰相框
            }
        }
        public void onNothingSelected(AdapterView<?> arg0) {}
    }
}

XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:orientation="horizontal" >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:paddingLeft="5dp"
            android:gravity="center"
            android:text="图像装饰类型:"
            android:textColor="@color/black"
            android:textSize="17sp" />
        <Spinner
            android:id="@+id/sp_decorate"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:spinnerMode="dialog" />
    </LinearLayout>
    <com.example.picture.widget.DecorateImageView
        android:id="@+id/div_scene"
        android:layout_width="match_parent"
        android:layout_height="270dp"
        android:src="@drawable/ylxs" />
</LinearLayout>

创作不易 觉得有帮助请点赞关注收藏~~~

相关文章
|
7月前
|
Android开发 数据安全/隐私保护 开发者
Android自定义view之模仿登录界面文本输入框(华为云APP)
本文介绍了一款自定义输入框的实现,包含静态效果、hint值浮动动画及功能扩展。通过组合多个控件完成界面布局,使用TranslateAnimation与AlphaAnimation实现hint文字上下浮动效果,支持密码加密解密显示、去除键盘回车空格输入、光标定位等功能。代码基于Android平台,提供完整源码与attrs配置,方便复用与定制。希望对开发者有所帮助。
136 0
|
5月前
|
存储 Android开发 数据安全/隐私保护
Thanox安卓系统增加工具下载,管理、阻止、限制后台每个APP运行情况
Thanox是一款Android系统管理工具,专注于权限、后台启动及运行管理。支持应用冻结、系统优化、UI自定义和模块管理,基于Xposed框架开发,安全可靠且开源免费,兼容Android 6.0及以上版本。
515 4
|
8月前
|
数据采集 JSON 网络安全
移动端数据抓取:Android App的TLS流量解密方案
本文介绍了一种通过TLS流量解密技术抓取知乎App热榜数据的方法。利用Charles Proxy解密HTTPS流量,分析App与服务器通信内容;结合Python Requests库模拟请求,配置特定请求头以绕过反爬机制。同时使用代理IP隐藏真实IP地址,确保抓取稳定。最终成功提取热榜标题、内容简介、链接等信息,为分析热点话题和用户趋势提供数据支持。此方法也可应用于其他Android App的数据采集,但需注意选择可靠的代理服务。
353 11
移动端数据抓取:Android App的TLS流量解密方案
APP开发的流程有哪些?
APP开发的过程当中,多多少少的也要遵循着自己的流程,从现有的一些情况来看,大多数的情况下再开发的过程当中加入着各种不同的开发方案,那么他们的流程究竟如何?
442 0
|
测试技术 UED
app开发流程有哪些
  app开发流程是需求方和供求方相互协调的过程,一般分为需求分析、功能设计、功能实现、项目测试、上线等几个步骤,下面我们就来一起看看ytkah团队进行app开发各个流程主要做哪些事情,让您对app开发设计有一个更全面的了解,更放心地将项目交予我们来为您实施。
2090 0
|
2月前
|
缓存 移动开发 JavaScript
如何优化UniApp开发的App的启动速度?
如何优化UniApp开发的App的启动速度?
545 139
|
2月前
|
移动开发 JavaScript weex
UniApp开发的App在启动速度方面有哪些优势和劣势?
UniApp开发的App在启动速度方面有哪些优势和劣势?
346 137
|
2月前
|
数据采集 JavaScript 前端开发
开发比分App?你缺的不是程序员
开发体育比分App,关键不在代码,而在懂体育、懂数据、懂用户。明确定位、理清需求、选好数据源,再找专业的产品、数据与技术人才协同,才能少走弯路。程序员最后入场,效率最高。
231 154
|
3月前
|
移动开发 小程序 Android开发
基于 uni-app 开发的废品回收类多端应用功能与界面说明
本文将对一款基于 uni-app 开发的废品回收类多端应用,从多端支持范围、核心功能模块及部分界面展示进行客观说明,相关资源信息也将一并呈现。
163 0