Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 12 additions & 6 deletions .github/workflows/developer-guide-docs.yml
Original file line number Diff line number Diff line change
Expand Up @@ -299,7 +299,7 @@ jobs:
set -euo pipefail
pip install --user language-tool-python==2.9.4

- name: Run LanguageTool grammar check (advisory)
- name: Run LanguageTool grammar check
run: |
set -euo pipefail
REPORT_DIR="build/developer-guide/reports"
Expand All @@ -314,7 +314,8 @@ jobs:
LT_COUNT="$(python3 -c 'import json,sys; d=json.load(open(sys.argv[1])); print(d.get("total",0))' "$REPORT_FILE" 2>/dev/null || echo 0)"
echo "LANGUAGETOOL_REPORT=$REPORT_FILE" >> "$GITHUB_ENV"
echo "LANGUAGETOOL_COUNT=$LT_COUNT" >> "$GITHUB_ENV"
echo "LanguageTool flagged ${LT_COUNT} match(es). This is advisory and does not fail the build." >&2
echo "LANGUAGETOOL_STATUS=$STATUS" >> "$GITHUB_ENV"
echo "LanguageTool flagged ${LT_COUNT} match(es). The final quality-gate step will fail the build if any matches remain." >&2

- name: Check for unused developer guide images
run: |
Expand Down Expand Up @@ -463,11 +464,16 @@ jobs:
echo "Rewrite the flagged paragraph so its first prose word starts with a capital letter." >&2
FAIL=1
fi
if [ "${LANGUAGETOOL_STATUS:-0}" != "0" ] || [ "${LANGUAGETOOL_COUNT:-0}" != "0" ]; then
echo "LanguageTool reported ${LANGUAGETOOL_COUNT:-?} match(es) (exit status ${LANGUAGETOOL_STATUS:-?}). See the developer-guide-languagetool artifact." >&2
echo "Either fix the prose, add the term to docs/developer-guide/languagetool-accept.txt, or document a new exception by disabling the rule in scripts/developer-guide/run_languagetool.py." >&2
FAIL=1
fi
if [ "$FAIL" -ne 0 ]; then
echo "Developer guide quality gates failed. Warnings from vale and asciidoctor are treated as build-breaking errors." >&2
echo "Developer guide quality gates failed. Warnings from vale, asciidoctor, and LanguageTool are treated as build-breaking errors." >&2
exit 1
fi
echo "Developer guide quality gates passed (vale issues=${VALE_ISSUE_COUNT:-0}, asciidoctor status=${ASCII_DOC_LINT_STATUS:-0}, unused-image status=${UNUSED_IMAGES_STATUS:-0})."
echo "Developer guide quality gates passed (vale issues=${VALE_ISSUE_COUNT:-0}, asciidoctor status=${ASCII_DOC_LINT_STATUS:-0}, unused-image status=${UNUSED_IMAGES_STATUS:-0}, languagetool count=${LANGUAGETOOL_COUNT:-0})."

- name: Comment with artifact download links
if: ${{ always() && github.event_name == 'pull_request' && !github.event.pull_request.head.repo.fork }}
Expand Down Expand Up @@ -538,7 +544,7 @@ jobs:
links.push(`- [Paragraph capitalization report](${artifactLinks.get('developer-guide-paragraph-capitalization')})`);
}
if (artifactLinks.has('developer-guide-languagetool')) {
links.push(`- [LanguageTool report (advisory)](${artifactLinks.get('developer-guide-languagetool')})`);
links.push(`- [LanguageTool report](${artifactLinks.get('developer-guide-languagetool')})`);
}

if (!links.length) {
Expand Down Expand Up @@ -568,7 +574,7 @@ jobs:
qualityLines.push(`- Paragraph capitalization: ${paragraphCapSummary}${paragraphCapLink ? ` ([report](${paragraphCapLink}))` : ''}`);
}
if (languagetoolSummary) {
qualityLines.push(`- LanguageTool (advisory): ${languagetoolSummary}${languagetoolLink ? ` ([report](${languagetoolLink}))` : ''}`);
qualityLines.push(`- LanguageTool: ${languagetoolSummary}${languagetoolLink ? ` ([report](${languagetoolLink}))` : ''}`);
}
if (unusedSummary) {
qualityLines.push(`- Image references: ${unusedSummary}${unusedLink ? ` ([report](${unusedLink}))` : ''}`);
Expand Down
62 changes: 31 additions & 31 deletions docs/developer-guide/Advanced-Theming.asciidoc

Large diffs are not rendered by default.

186 changes: 94 additions & 92 deletions docs/developer-guide/Advanced-Topics-Under-The-Hood.asciidoc

Large diffs are not rendered by default.

32 changes: 16 additions & 16 deletions docs/developer-guide/Animations.asciidoc
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ If you add components to a form that's showing, it's your responsibility to invo

`animateLayout()` method is a fancy form of revalidate that animates the components into their laid out position. After changing the layout & invoking this method the components move to their new sizes/positions seamlessly. `Form` exposes convenience wrappers such as `animateLayout*()` that forward to the underlying content pane, so you can call the methods directly on the form unless you specifically need to animate a nested container.

This sort of behavior creates a special case where setting the size/position makes sense. When you set the size/position in the demo code here you're positioning the components at the animation start position above the frame.
This sort of behavior creates a special case where setting the size/position makes sense. When you set the size/position in the demo code here you're positioning the components at the animation start position above the frame:

[source,java]
----
Expand Down Expand Up @@ -114,7 +114,7 @@ The `AndWait` variant blocks the calling thread until the animation completes. T
include::../demos/common/src/main/java/com/codenameone/developerguide/animations/AnimationSynchronicityDemo.java[tag=animationSequence,indent=0]
----

First the UI goes thru an "unlayout" animation, once that completes the layout itself is performed.
First the UI goes through an "unlayout" animation, once that completes the layout itself is performed.

// HTML_ONLY_START
IMPORTANT: The `AndWait` calls needs to be invoked on the Event Dispatch Thread despite being "blocking." This is a common convention in Codename One powered by a unique capability of Codename One: `invokeAndBlock`. +
Expand All @@ -141,7 +141,7 @@ There are several more variations on the standard animate methods. Several metho

The value for the fade argument is a number between 0 and 255 where 0 represents full transparency and 255 represents full opacity.

Some animate layout methods are hierarchy based. They work like the regular `animateLayout` methods but recurse into the entire https://www.codenameone.com/javadoc/com/codename1/ui/Container.html[Container] hierarchy. These methods work well when you've components in a nested hierarchy that need to animate into place. This is demonstrated in the opening sequence of the kitchen sink demo:
Some animate layout methods are hierarchy based. They work like the regular `animateLayout` methods but recurse into the entire https://www.codenameone.com/javadoc/com/codename1/ui/Container.html[Container] hierarchy. These methods work well when you have components in a nested hierarchy that need to animate into place. This is demonstrated in the opening sequence of the kitchen sink demo:

[source,java]
----
Expand All @@ -154,7 +154,7 @@ WARNING: Avoid the hierarchy version where possible. Its slower but more importa

==== Sequencing animations via AnimationManager

All the animations go thru a per-form queue: the https://www.codenameone.com/javadoc/com/codename1/ui/AnimationManager.html[AnimationManager].
All the animations go through a per-form queue: the https://www.codenameone.com/javadoc/com/codename1/ui/AnimationManager.html[AnimationManager].
This effectively prevents two animations from mutating the UI in parallel so you won't have collisions between two conflicting sides. Things get more interesting when you try to do something like this:

[source,java]
Expand Down Expand Up @@ -198,7 +198,7 @@ Every component in Codename One contains an `animate()` method that returns a bo

If the `animate` method returns true then the animation will be painted (the `paint` method of the `Animation` interface would be invoked).

TIP: it's important to deregister animations when they aren’t needed to conserve battery life.
TIP: It's important to deregister animations when they aren’t needed to conserve battery life.

If you derive from a component, which has its own animation logic you might damage its animation behavior by deregistering it, so use care with the low-level API’s.

Expand All @@ -216,7 +216,7 @@ include::../demos/common/src/main/java/com/codenameone/developerguide/animations

==== Why not just write code in paint

Animations are comprised of two parts, the logic (deciding the position etc) and the painting. The paint method should be dedicated to painting, not to the actual moving of the components.
Animations comprise two parts, the logic (deciding the position, etc.) and the painting. The paint method should be dedicated to painting, not to the actual moving of the components.

The separation of concerns allows you to avoid redundant painting for example, if animate didn't trigger a change return `false` to avoid the overhead related to animations.

Expand All @@ -243,21 +243,21 @@ When defining a transition you define the entering transition and the exiting tr

For most cases the method `setFormTransitonIn` should go unused. That API exists for some elaborate custom transitions that might need to have a special effect both when transitioning in and out of a specific form. But, most of these effects are easier to achieve with layout animations (for example, components dropping into place etc.).

For `Dialog` the transition in shows its appearance and the transition out shows its disposal. in that case both transitions make a lot of sense.
For `Dialog` the transition in shows its appearance and the transition out shows its disposal. In that case both transitions make a lot of sense.
****

.Back/Forward Transitions
****
Transitions have a direction and can all be played either in incoming or outgoing direction. A transition can be flipped (played in reverse) when use an RTL language footnote:[Right to left/bidi language such as Hebrew or Arabic] or when you traverse backwards in the form navigation hierarchy.

Normally `Form.show()` displays the next `Form` with an incoming transition based on the current RTL mode. If use `Form.showBack()` it will play the transition in reverse.
Normally `Form.show()` displays the next `Form` with an incoming transition based on the current RTL mode. If you use `Form.showBack()` it will play the transition in reverse.
****

TIP: When working with high-level animations you can select #Slow Motion# option in the simulator to slow down animations and inspect their details

Themes define the default transitions used when showing a form, these differ based on the OS. In most platforms the default is `Slide` whereas in iOS the default is `SlideFade` which slides the content pane and title while fading in/out the content of the title area.

TIP: `SlideFade` is problematic without a title area. If you've a `Form` that lacks a title area you would recommend to disable `SlideFade` at least for that `Form`.
TIP: `SlideFade` is problematic without a title area. If you have a `Form` that lacks a title area you would recommend to disable `SlideFade` at least for that `Form`.

// HTML_ONLY_START
Check out the full set of theme constants in the https://www.codenameone.com/manual/advanced-theming.html#theme-constants-section[Theme Constants Section].
Expand All @@ -276,7 +276,7 @@ To apply a transition to a component you can use the `Container.replace()` metho
include::../demos/common/src/main/java/com/codenameone/developerguide/animations/ReplaceTransitionDemo.java[tag=replaceTransition,indent=0]
----

TIP: Replace even works when you've a layout constraint in place for example, replacing a component in a border layout will do the "right thing." But, some layouts such as `TableLayout` might be tricky in such cases so recommend wrapping a replaceable `Component` in a border layout and replacing the content.
TIP: Replace even works when you have a layout constraint in place for example, replacing a component in a border layout will do the "right thing." But, some layouts such as `TableLayout` might be tricky in such cases so recommend wrapping a replaceable `Component` in a border layout and replacing the content.

`Container.replace()` can also be used with a null transition at which point it replaces instantly with no transition.

Expand All @@ -285,7 +285,7 @@ TIP: Replace even works when you've a layout constraint in place for example, re
The slide transitions are used to move the `Form/Component` in a sliding motion to the side or up/down. Four basic types of slide transitions exist:

. Slide - the most commonly used transition
. Fast Slide - historically this provided better performance for old device types. it's no longer recommended for newer devices
. Fast Slide - historically this provided better performance for old device types. It's no longer recommended for newer devices
. Slide Fade - the iOS default where the title area features a fade transition
. Cover/Uncover - a kind of slide transition where the source or destination form slides while the other remains static in place

Expand All @@ -306,7 +306,7 @@ image::img/transition-slide-vertical.jpg[The slide transition can be applied ver
.Slide fade fades in the destination title while sliding the content pane it's the default on iOS
image::img/transition-slide-fade.jpg[Slide fade fades in the destination title while sliding the content pane its the default on iOS,scaledwidth=70%]

TIP: `SlideFade` is problematic without a title area. If you've a `Form` that lacks a title area you would recommend to disable `SlideFade` at least for that `Form`.
TIP: `SlideFade` is problematic without a title area. If you have a `Form` that lacks a title area you would recommend to disable `SlideFade` at least for that `Form`.

.With cover transitions the source form stays in place as it's covered by the destination. This transition can be played both horizontally and vertically
image::img/transition-cover.jpg[With cover transitions the source form stays in place as it's covered by the destination. This transition can be played both horizontally and vertically,scaledwidth=70%]
Expand Down Expand Up @@ -361,13 +361,13 @@ once.
.Morph Transition
image::img/mighty-morphing-components-1.png[Morph Transition,scaledwidth=15%]

To support this behavior you've the https://www.codenameone.com/javadoc/com/codename1/ui/animations/MorphTransition.html[MorphTransition] class that provides this same effect coupled with a fade to
To support this behavior you have the https://www.codenameone.com/javadoc/com/codename1/ui/animations/MorphTransition.html[MorphTransition] class that provides this same effect coupled with a fade to
the rest of the UI (see <<mighty-morphing-components-1>>).

Since the transition is created before the form exists you can't reference explicit components within the form
when creating the morph transition (to show which component becomes which) so you need to refer
to them by name. This means you need to use `setName(String)` on the components in the source/destination
forms so the transition will be able to find them.
forms so the transition will be able to find them:

[source,java]
----
Expand All @@ -376,7 +376,7 @@ include::../demos/common/src/main/java/com/codenameone/developerguide/animations

==== SwipeBackSupport

iOS7+ allows swiping back one form to the previous form, Codenmae One has an API to enable back swipe transition:
iOS7+ allows swiping back one form to the previous form, Codename One has an API to enable back swipe transition:

[source,java]
----
Expand All @@ -389,7 +389,7 @@ That one command will enable swiping back from `currentForm`. https://www.codena
[source,java]
----
/**
* Useful when passing a value that might not exist to a function, e.g. when we
* Useful when passing a value that might not exist to a function, e.g. When we
* pass a form that we might need to construct dynamically later on.
*/
public interface LazyValue<T> {
Expand Down
Loading
Loading