Скачать или смотреть Flutter Pixel Shader Test 3

Added 3 more shaders,
David H, StackOverflow: Edge effect
(dual texture)
Microsoft Win2D Example, Dissolve
MASK image in the Win2D example, was programmatically, created.
I created "IT", offline with Dart:

body:
Container(
decoration: const BoxDecoration(
gradient: RadialGradient(
center: Alignment.center,
colors: [Colors.white, Colors.black],
stops: [0.77, 0.98]
)),
),

Goto Fullscreen, Screenshot, Crop, import to assets.

Apple Text Shading Effect, 2 textures,
1. Heightmap, 2. shading image.
(for testing, it is in the assets, i will add a picker, later)
For Windows, you could generate the text-heightmap,
close to Appe Heightmap from White Text,
by using Paint.net and Edge Shader Plugin.


Because of 2 textures, a new widget is required,
DualTextureContainer, and Painter.

class DualTextureContainer
{
final UI.ImageShader imageShader; // Texture
final UI.ImageShader imageShader2; // Texture2

final UI.FragmentProgram fragmentProgram; // Generated Program
final double textureWidth; // for xy CoOrd Normalization
final double textureHeight;
DualTextureContainer(this.imageShader, this.imageShader2, this.fragmentProgram, this.textureWidth, this.textureHeight);
}

Future LT DualTextureContainer GT loadDualShaderProgram(UI.FragmentProgram program, UI.Image uii, UI.Image uii2, UI.Size textureSize) async
{
final UI.ImageShader imageShader = UI.ImageShader
(
uii,
UI.TileMode.decal,
UI.TileMode.decal,
Matrix4.identity().storage,
);

// Mask(MS Dissolve), Text-Heightmap-shading (Apple), Watermark
final UI.ImageShader imageShader2 = UI.ImageShader
(
uii2,
UI.TileMode.decal,
UI.TileMode.decal,
Matrix4.identity().storage,
);

return DualTextureContainer( imageShader, imageShader2, program, textureSize.width.toDouble(), textureSize.height.toDouble());
}


// Paint
@override
void paint(Canvas canvas, UI.Size size)
{
final paint = Paint()
..shader = shaderContainer.fragmentProgram.shader
(
floatUniforms: Float32List.fromList([ scale, w, h, amount, feather, 0, 0 ]),
samplerUniforms: [ shaderContainer.imageShader, shaderContainer.imageShader2 ],
);

canvas.drawRect(Rect.fromLTWH(0, 0, size.width , size.height ), paint);
}

// GLSL Wind2D Example

#version 320 es
precision highp float;

layout(location=0)out vec4 fragColor;

layout(location = 0) uniform float scale; // scale to fit canvas
layout(location = 1) uniform float w; // Texture w,h
layout(location = 2) uniform float h;
layout(location = 3) uniform float v1; // Amount
layout(location = 4) uniform float v2; // Feather
layout(location = 5) uniform float v3;
layout(location = 6) uniform float v4;

layout(location = 7) uniform sampler2D image;
layout(location = 8) uniform sampler2D image2;

// Dissolve
/*
Converted from:
Win2D Example
https://github.com/microsoft/Win2D-Sa...
Copyright (c) Microsoft Corporation. All rights reserved.
MIT License

https://github.com/microsoft/Win2D-Sa...

*/


void main()
{
float dissolveAmount = v1;
float feather = v2;

float scaleX = 1.0 / w;
float scaleY = 1.0 / h;
vec2 xy0 = gl_FragCoord.xy;
vec2 xy = vec2(xy0.x * scaleX, xy0.y * scaleY) / scale;
vec4 color = texture(image, xy);
float mask = texture(image2, xy).r;

float adjustedMask = mask * (1.0 - feather) + feather / 2.0;
float alpha = clamp((adjustedMask - dissolveAmount) / feather + 0.5, 0.0, 1.0);

fragColor = color * alpha;
}


++++++++++++++++++++++++++++++++++
also, tested Flutter_Map Plugin,
that require Metadata from MacOS.

CPM my old imagedata plugin, called it image_ut.

2 func: fetch image metadata and copy Uint8List Image to Mac Pasteboard.
The new Plugin-template, changed, there are 3 .dart files.
No idea, how it work.
I deleted, the 3 files, replaced with the old one.
No Problem.


The Examples, in the Flutter_Map Github, is very good.
You should have no problem, CPM from it.

---------------
path: ^1.8.1
desktop_window: ^0.4.0
image_size_getter: ^2.1.2
path_provider: ^2.0.11
file_picker: ^4.0.1
pasteboard: ^0.2.0
date_format: ^2.0.6
image: ^3.2.0
map stuff
flutter_map: ^2.2.0
latlong2: ^0.8.1

My Channel
image_ut:
path: ../plugins/image_ut

Images were from Flickr and Web-download, for Educational Purposes.

Snippets from me, released to Public Domain.