Skip to content

Support new color functions for HSL shift #83

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
maxmmitchell wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Support new color functions for HSL shift #83

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
16 changes: 16 additions & 0 deletions app/src/main/java/com/example/cahier/developer/brushgraph/data/DisplayUtils.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import com.example.cahier.developer.brushdesigner.ui.NumericLimits
import ink.proto.BrushBehavior as ProtoBrushBehavior
import ink.proto.BrushFamily as ProtoBrushFamily
import ink.proto.BrushPaint as ProtoBrushPaint
import ink.proto.ColorFunction as ProtoColorFunction
import ink.proto.PredefinedEasingFunction as ProtoPredefinedEasingFunction
import ink.proto.StepPosition as ProtoStepPosition

Expand Down Expand Up @@ -517,3 +518,18 @@ fun ProtoBrushFamily.InputModel.displayStringRId(): Int =
hasPassthroughModel() -> R.string.bg_model_passthrough
else -> R.string.bg_unknown_model
}

fun ProtoColorFunction.displayStringRId(): Int =
if (this.hasOpacityMultiplier()) {
R.string.bg_target_opacity_multiplier
} else if (this.hasReplaceColor()) {
R.string.bg_replace_color
} else if (this.hasHueOffsetRadians()) {
R.string.bg_target_hue_offset
} else if (this.hasSaturationMultiplier()) {
R.string.bg_target_saturation_multiplier
} else if (this.hasLuminosityOffset()) {
R.string.bg_target_luminosity_offset
} else {
R.string.bg_node_unknown
}
Comment thread
maxmmitchell marked this conversation as resolved.
8 changes: 1 addition & 7 deletions app/src/main/java/com/example/cahier/developer/brushgraph/data/GraphDataModel.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -183,13 +183,7 @@ sealed interface NodeData {
override fun title() = R.string.bg_color_function

override fun subtitles() =
listOf(
if (function.hasOpacityMultiplier()) {
DisplayText.Resource(R.string.bg_opacity_multiplier)
} else {
DisplayText.Resource(R.string.bg_replace_color)
}
)
listOf(DisplayText.Resource(function.displayStringRId()))
}

/** Wraps a [ProtoBrushBehavior.Node] */
Expand Down
5 changes: 4 additions & 1 deletion app/src/main/java/com/example/cahier/developer/brushgraph/ui/Tooltips.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,10 @@ fun getInputModelTooltip(resId: Int): Int = when (resId) {
}

fun getColorFunctionTooltip(resId: Int): Int = when (resId) {
R.string.bg_opacity_multiplier -> R.string.bg_tooltip_color_func_opacity
R.string.bg_target_opacity_multiplier -> R.string.bg_tooltip_color_func_opacity
R.string.bg_replace_color -> R.string.bg_tooltip_color_func_replace
R.string.bg_target_luminosity_offset -> R.string.bg_tooltip_color_func_luminosity
R.string.bg_target_hue_offset -> R.string.bg_tooltip_color_func_hue
R.string.bg_target_saturation_multiplier -> R.string.bg_tooltip_color_func_saturation
else -> R.string.bg_tooltip_color_func_default
}
125 changes: 95 additions & 30 deletions ...rc/main/java/com/example/cahier/developer/brushgraph/ui/fields/ColorFunctionNodeFields.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,25 +39,22 @@ import com.example.cahier.developer.brushdesigner.ui.EnumDropdown
import com.example.cahier.developer.brushdesigner.ui.NumericField
import com.example.cahier.developer.brushdesigner.ui.NumericLimits
import com.example.cahier.developer.brushgraph.data.NodeData
import com.example.cahier.developer.brushgraph.data.displayStringRId
import com.example.cahier.developer.brushgraph.ui.FieldWithTooltip
import com.example.cahier.developer.brushgraph.ui.getColorFunctionTooltip
import ink.proto.Color as ProtoColor
import ink.proto.ColorFunction as ProtoColorFunction

@Composable
fun ColorFunctionNodeFields(
function: ProtoColorFunction,
onUpdate: (NodeData) -> Unit,
onChooseColor: (Color, (Color) -> Unit) -> Unit,
onDropdownEditComplete: () -> Unit,
onFieldEditComplete: () -> Unit,
modifier: Modifier = Modifier,
function: ProtoColorFunction,
onUpdate: (NodeData) -> Unit,
onChooseColor: (Color, (Color) -> Unit) -> Unit,
onDropdownEditComplete: () -> Unit,
onFieldEditComplete: () -> Unit,
modifier: Modifier = Modifier,
) {
val currentTypeResId = if (function.hasOpacityMultiplier()) {
R.string.bg_opacity_multiplier
} else {
R.string.bg_replace_color
}
val currentTypeResId = function.displayStringRId()

Column(modifier = modifier) {
FieldWithTooltip(
Expand All @@ -70,28 +67,54 @@ fun ColorFunctionNodeFields(
EnumDropdown(
label = stringResource(R.string.bg_function_type),
currentValue = currentTypeResId,
values = listOf(R.string.bg_opacity_multiplier, R.string.bg_replace_color),
values = listOf(
R.string.bg_target_opacity_multiplier,
R.string.bg_replace_color,
R.string.bg_target_hue_offset,
R.string.bg_target_saturation_multiplier,
R.string.bg_target_luminosity_offset
),
displayName = { stringResource(it) },
onSelected = { resId ->
if (resId != currentTypeResId) {
onUpdate(
if (resId == R.string.bg_opacity_multiplier) {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setOpacityMultiplier(1f).build()
)
} else {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder()
.setReplaceColor(
ProtoColor.newBuilder()
.setRed(0f)
.setGreen(0f)
.setBlue(0f)
.setAlpha(1f)
.build()
)
.build()
)
when (resId) {
R.string.bg_target_opacity_multiplier -> {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setOpacityMultiplier(1f)
.build()
)
}

R.string.bg_replace_color -> {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setReplaceColor(
ProtoColor.newBuilder().setRed(0f).setGreen(0f)
.setBlue(0f).setAlpha(1f).build()
).build()
)
}

R.string.bg_target_hue_offset -> {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setHueOffsetRadians(0f)
.build()
)
}

R.string.bg_target_saturation_multiplier -> {
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setSaturationMultiplier(1f)
.build()
)
}

else -> { // bg_target_luminosity_offset
NodeData.ColorFunction(
ProtoColorFunction.newBuilder().setLuminosityOffset(0f)
.build()
)
}
}
)
}
Expand All @@ -104,7 +127,7 @@ fun ColorFunctionNodeFields(
NumericField(
title = stringResource(R.string.bg_label_opacity_multiplier),
value = function.opacityMultiplier,
limits = NumericLimits(0f, 2f, 0.01f),
limits = NumericLimits(0f, 2f, 0.01f, "x"),
onValueChanged = {
onUpdate(
NodeData.ColorFunction(
Expand All @@ -114,6 +137,48 @@ fun ColorFunctionNodeFields(
},
onValueChangeFinished = onFieldEditComplete
)
} else if (function.hasSaturationMultiplier()) {
NumericField(
title = stringResource(R.string.bg_label_saturation_multiplier),
value = function.saturationMultiplier,
limits = NumericLimits(0f, 2f, 0.01f, "x"),
onValueChanged = {
onUpdate(
NodeData.ColorFunction(
function.toBuilder().setSaturationMultiplier(it).build()
)
)
},
onValueChangeFinished = onFieldEditComplete
)
} else if (function.hasHueOffsetRadians()) {
NumericField(
title = stringResource(R.string.bg_label_hue_offset),
value = function.hueOffsetRadians,
limits = NumericLimits.radiansShownAsDegrees(-360f, 360f),
onValueChanged = {
onUpdate(
NodeData.ColorFunction(
function.toBuilder().setHueOffsetRadians(it).build()
)
)
},
onValueChangeFinished = onFieldEditComplete
)
} else if (function.hasLuminosityOffset()) {
Comment thread
maxmmitchell marked this conversation as resolved.
NumericField(
title = stringResource(R.string.bg_label_luminosity_offset),
value = function.luminosityOffset,
limits = NumericLimits.floatShownAsPercent(-100f, 100f),
onValueChanged = {
onUpdate(
NodeData.ColorFunction(
function.toBuilder().setLuminosityOffset(it).build()
)
)
},
onValueChangeFinished = onFieldEditComplete
)
} else if (function.hasReplaceColor()) {
val color = function.replaceColor
val composeColor =
Expand Down
10 changes: 8 additions & 2 deletions app/src/main/res/values/strings.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -497,7 +497,6 @@
<string name="bg_port_angle">Angle</string>
<string name="bg_port_mag">Mag</string>

<string name="bg_opacity_multiplier">opacity multiplier</string>
<string name="bg_replace_color">replace color</string>

<string name="bg_tool_type_unknown">unknown</string>
Expand Down Expand Up @@ -661,6 +660,10 @@
<string name="bg_label_out">Out</string>
<string name="bg_label_step_count">Step Count</string>
<string name="bg_label_opacity_multiplier">Opacity Multiplier</string>
<string name="bg_label_hue_offset">Hue Offset</string>
<string name="bg_label_saturation_multiplier">Saturation Multiplier</string>
<string name="bg_label_luminosity_offset">Luminosity Offset</string>

<!-- Tooltips -->
<!-- NodeData Tooltips -->
<string name="bg_tooltip_node_tip">Defines the geometric shape and size of the brush tip. This shape acts as a cross-section that is repeated or extruded along the path to create the stroke mesh.</string>
Expand Down Expand Up @@ -837,8 +840,11 @@
<string name="bg_tooltip_model_default">Selects the model used to smooth raw hardware inputs.</string>

<!-- ColorFunc Tooltips -->
<string name="bg_tooltip_color_func_opacity">Multiplies the opacity of the stroke by a calculated value, allowing for dynamic transparency effects.</string>
<string name="bg_tooltip_color_func_opacity">Multiplies the opacity of the stroke by the specified value.</string>
<string name="bg_tooltip_color_func_replace">Replaces the brush color with a specified color, ignoring the baseline color for this function\'s output.</string>
<string name="bg_tooltip_color_func_hue">Offsets the hue of the stroke by the specified value.</string>
<string name="bg_tooltip_color_func_saturation">Multiplies the saturation of the stroke by the specified value.</string>
<string name="bg_tooltip_color_func_luminosity">Offsets the luminosity of the stroke by the specified value.</string>
<string name="bg_tooltip_color_func_default">Selects the type of color function to apply.</string>
<!-- Tutorial Strings -->
<string name="bg_tutorial_welcome_title">Welcome!</string>
Expand Down
Loading
Loading