ContourView

项目介绍

• Проект: ContourView.
• Тип проекта: пользовательский View.
• Назначение: использование для создания контура с помощью кривой Безье.
• Серия: компонент, адаптированный из openharmony.
• Функционал: создание пользовательского View с использованием кривой Безье для отрисовки контура.
• Состояние переноса: основная функциональность реализована.
• Различия в вызовах: отсутствуют.
• Версия разработки: sdk6, DevEco Studio2.2 Beta1.
• Базовая версия: Release 1.0.1.

Эффект демонстрации

Инструкция по установке

1. В файле build.gradle в корневом каталоге проекта добавьте следующие строки:

allprojects {
    repositories {
        maven {
             url 'https://s01.oss.sonatype.org/content/repositories/releases/'
        }
    }
}

2. В файл build.gradle модуля приложения добавьте следующую строку:

 dependencies {
    implementation('com.gitee.chinasoft_ohos:contourView:1.0.0')
    ......  
 }

После этого проект можно запустить на sdk6 и DevEco Studio 2.2 Beta1. Если проект не запускается, удалите файлы .gradle, .idea, build и build.gradle и создайте новый проект. Скопируйте файлы из нового проекта в корневой каталог.

Использование

Использовать библиотеку просто. Для этого достаточно изучить примеры исходного кода. Чтобы создать представление ContourView, используйте следующий код:

 <com.ocnyang.contourview.ContourView
            ohos:height="match_parent"
            ohos:width="match_parent"
            app:contour_style="Sand"
            app:shader_mode="Radial"
            app:shader_startcolor="$color:startcolor"
            app:shader_endcolor="$color:endcolor"
            app:shader_style="Left_To_Bottom"
            />

В Java-коде:

private void initCustomContourView() {
        ContourView contourViewCustom = (ContourView) findComponentById(ResourceTable.Id_contourview_custom);
        int width = getWidth();
        int hight = 700;
        int[] ints = {width / 2, 50, ((int) (width * 0.75)), hight / 2, ((int) (width * 0.35)), 350};
        int[] intArr = new int[]{width / 5, hight / 3, width / 4 * 3, hight / 2, width / 2, ((int) (hight * 0.9)), width / 5, ((int) (hight * 0.8))};
        contourViewCustom.setPoints(ints, intArr);
        try {
            contourViewCustom.setShaderStartColor(new Color(getResourceManager().getElement(ResourceTable.Color_startcolor).getColor()));
            contourViewCustom.setShaderEndColor(new Color(getResourceManager().getElement(ResourceTable.Color_endcolor).getColor()));
        } catch (Exception e) {
        }
        contourViewCustom.setShaderMode(ContourView.SHADER_MODE_RADIAL);
    }

Динамические атрибуты

Все перечисленные (xml) атрибуты имеют соответствующие методы настройки. Кроме того, есть несколько динамически настраиваемых атрибутов.

• Координаты якоря контура

  public void setPoints(List<Point[]> pointsList) // List<> указывает количество контуров, Point[] указывает координаты конкретного контура, каждый контур имеет как минимум 4 точки привязки.

• Пользовательский режим заливки контура

  public void setShader(Shader... shader) // Shader: передать собственный RadialGradient, SweepGradient, LinearGradient. // При передаче нескольких шейдеров несколько контуров будут иметь разные режимы заливки, Shader[0] заполняет контур 1, Shader[1] заполняет контур 2...

Step2. Используйте в макете или установите соответствующие пользовательские атрибуты.

<com.ocnyang.contourview.ContourView
    ohos:layout_width="match_parent"
    ohos:layout_height="400dp"
    app:contour_style="Ripples"
    app:shader_endcolor="@color/endcolor"
    app:shader_mode="RadialGradient"
    app:shader_startcolor="@color/startcolor"
    app:shader_style="Center"
    app:smoothness="0.2"/>

Установите атрибуты в соответствии с вашими потребностями.

Step3. Если вам нужно настроить свой уникальный контур, вы можете динамически настроить следующее в коде.

/**
 * Настроить координаты якоря для управления областью рисования.
 */
private void initCustomContourView() {
    ContourView contourViewCustom = (ContourView) findViewById(R.id.contourview_custom);
    int width = getWidth();// Получить ширину экрана
    int hight = 400;
    int[] ints = {ширина / 2, 0, ширина, высота / 2, ширина / 2, высота, 0, высота / 2}; **int[] intArr = new int[]{width / 2, hight / 4, width / 4 * 3, hight / 2, width / 2, hight / 4 * 3, width / 4, hight / 2};**

contourViewCustom.setPoints(ints, intArr); contourViewCustom.setShaderStartColor(getResources().getColor(R.color.startcolor)); contourViewCustom.setShaderEndColor(getResources().getColor(R.color.endcolor)); contourViewCustom.setShaderMode(ContourView.SHADER_MODE_RADIAL);

/**

• Controls the color of the drawing. */ private void initBeachContourView() { ContourView contourViewBeach = ((ContourView) findViewById(R.id.contourview_beach));

RadialGradient radialGradient = new RadialGradient(0, 0,4000, getResources().getColor(R.color.startcolor), getResources().getColor(R.color.endcolor), Shader.TileMode.CLAMP); LinearGradient linearGradient = new LinearGradient(0, 0, getWidth(), 400, Color.argb(30, 255, 255, 255), Color.argb(90, 255, 255, 255), Shader.TileMode.REPEAT); contourViewBeach.setShader(radialGradient, linearGradient); }

测试信息

CodeCheck代码测试无异常 CloudTest代码测试无异常 病毒安全检测通过 当前版本demo功能与原组件基本无差异

版本迭代

• 0.0.1-SNAPSHOT

版权和许可信息

Apache 2.0 License