docs: Added basic shader tutorial#3799
Conversation
…n utf-8 character in path)
spydon
left a comment
There was a problem hiding this comment.
I can see that you have put a lot of work into this! Which is very appreciated, there is quite a few things that need to be fixed for it to get merged though.
The main things that need to be fixed are:
- Write and explain the things in an order that doesn't give errors, it should be a tutorial not a debug log.
- Inline code needs to only have one back tick before and after the code, only code blocks should have three.
- Code needs to be formatted and analyzed according to the flame_lint rules.
- Basic steps for how to set up flame and flutter should not be included in this tutorial, but it can link to the barebones one (and if anything is missing in that one it should be added there instead).
- There shouldn't be any cspell ignores, add the words to the correct dictionaries.
- Notes should be short.
|
|
||
| @override | ||
| void onHoverEnter() { | ||
| super.onHoverEnter(); |
There was a problem hiding this comment.
The indention depth is wrong everywhere I think, it should be 2 spaces for dart and it's 4
| void onHoverEnter() { | ||
| super.onHoverEnter(); | ||
|
|
||
| final OutlinePostProcess outlinePostProcess = postProcess as OutlinePostProcess; |
There was a problem hiding this comment.
This would trigger the analyzer, I would recommend running all the code in the examples through flame_lint and make sure there are no warnings
doc/tutorials/basic_shader/step5.md
Outdated
|
|
||
| ```{note} | ||
| The loop of a GLSL shader accepts only a compile time constant. | ||
| So as far as I know we can not use the outline width, because that is a |
There was a problem hiding this comment.
What do you mean with the outline distance here? You should be able to pass uniforms.
There was a problem hiding this comment.
If I try to use the uniforms in shaders as a for loop bound it gives a runtime error:
SkSL Error:
error: 34: loop index initializer must be a constant expression
for (int y = _78; y <= bound; y++)
^^^^^^^^^^^
error: 31: loop index initializer must be a constant expression
for (int x = _67; x <= bound; x++)
^^^^^^^^^^^
2 errorsI checked around the internet for a solution but I did not found any (yet).
I am open to suggestions, because this is clearly a wrong design / pattern in multiple ways.
Attached an image of the setup, with modified code and console and with the result:

doc/tutorials/basic_shader/step5.md
Outdated
|
|
||
| Now run the application. | ||
| Open the console (```Ctrl + J```). | ||
| Execute ```flutter run```, then choose your platform. |
There was a problem hiding this comment.
Same here, this should not be needed, just write that they should run it.
|
@kornellapu is this ready for review again? :) |
- Remove setup/widget steps that overlap with bare flame game tutorial - Link bare_flame_game.md from intro instead - Convert appendix into regular step 4 (User Input) - Renumber steps: sprite component, post process, shader, user input - Fix Dart code formatting: 2-space indent, final fields, trailing commas - Remove version numbers, separate repo link, and author's notes section - Remove Windows-specific paths and VS Code instructions - Shorten overly long notes and fix incorrect O(n²) claim - Remove debug narrative and appendix markers from code - Fix typos and minor wording issues
- Match heading style with other tutorials (numbered H1, unnumbered H2) - Rename myPaint to _myPaint (private field convention) - Remove unnecessary import of dart:async - Remove unnecessary return super.onLoad() calls - Fix grammar: "We also can" -> "We can also", "in runtime" -> "at runtime" - Fix phrasing: remove spurious commas, add missing commas - Replace informal "Okay so..." with clearer wording - Fix "look like" -> "look"
- Tighten all prose across step files and takeaways - Rename SwordSpritePostProcessed to OutlinedSwordSprite - Fix double dots to ellipses - Remove em dashes - Use direct, concise language throughout
Wrap lines inside note blocks and code block comments to stay within the 80-char limit required by MD013 for code blocks.
Description
Added Basic Shader Tutirial to Flame documentation.
Added one note to CONTRIBUTING.md, which explains how to resolve non UTF-8 characters in path.
Checklist
docsand added dartdoc comments with///.examplesordocs.Breaking Change?
Related Discussion
Adding tutorial to the documentation as discussed here.
There are changes in the tutorial compared to what was previously discussed: