Print a warning when trying to animate deprecated properties

This commit is contained in:
Simon Hausmann 2021-02-02 22:50:52 +01:00
parent 246398fcb3
commit c771bcff45
10 changed files with 30 additions and 18 deletions

View file

@ -508,7 +508,7 @@ Simple animation that animates a property can be declared with `animate` like so
Example := Rectangle {
property<bool> pressed;
background: pressed ? blue : red;
animate color {
animate background {
duration: 100ms;
}
}

View file

@ -22,7 +22,7 @@ MemoryTile := Rectangle {
property <resource> icon;
background: solved ? #34CE57 : #3960D5;
animate color { duration: 800ms; }
animate background { duration: 800ms; }
Image {
source: icon;

View file

@ -139,7 +139,7 @@ MainWindow := Window {
}
}
animate x, y, height, width, color, border_radius {
animate x, y, height, width, background, border_radius {
duration: 300ms;
easing: ease_in_out;
}

View file

@ -252,7 +252,7 @@ export MainWindow := Window {
Rectangle {
background: current-theme.window-background-color;
animate color { duration: 500ms; easing: ease-out; }
animate background { duration: 500ms; easing: ease-out; }
}
Rectangle {
@ -264,7 +264,7 @@ export MainWindow := Window {
height: pieces_size * 5.4;
x: (parent.width - width)/2;
y: (parent.height - height)/2;
animate color, border-color, border-width, border-radius { duration: 500ms; easing: ease-out; }
animate background, border-color, border-width, border-radius { duration: 500ms; easing: ease-out; }
Rectangle {
width: parent.width * 90%;

View file

@ -567,6 +567,14 @@ impl Element {
diag,
tr,
) {
if unresolved_prop_name != resolved_name.as_ref() {
diag.push_property_deprecation_warning(
&unresolved_prop_name,
&resolved_name,
&prop_name_token,
);
}
if r.property_animations
.insert(
resolved_name.to_string(),

View file

@ -32,8 +32,8 @@ SuperSimple := Rectangle {
animate * { duration: 100ms; }
// ^error{catch-all property is only allowed within transitions}
animate color, foo { duration: 100ms; }
// ^error{'foo' is not an animatable property}
animate background, foo { duration: 100ms; }
// ^error{'foo' is not an animatable property}
text := Text{ animate x { duration: 1000ms; } }
animate text.x { duration: 100ms; }

View file

@ -12,8 +12,8 @@ X := Rectangle {
animate x { easing: ease-in; }
animate y { easing: foo; }
// ^error{Unknown unqualified identifier 'foo'}
animate color { easing: a; }
// ^error{Cannot convert int to easing}
animate background { easing: a; }
// ^error{Cannot convert int to easing}
property <int> a; animate a { easing: cubic-bezier(0.01,1.46,0.94,1.37); }
property <int> b; animate b { easing: cubic-bezier(0.01,1.46,0.94); }
// ^error{Not enough arguments}

View file

@ -10,7 +10,7 @@ LICENSE END */
TestCase := Rectangle {
property<bool> checked;
property <int> border;
animate color { }
animate background { }
states [
checked when checked: {
color: blue;
@ -25,7 +25,7 @@ TestCase := Rectangle {
}
in checked: {
// ^error{The property 'background' cannot have transition because it already has an animation}
animate color { }
animate background { }
}
]

View file

@ -15,5 +15,9 @@ Xxx := Rectangle {
Rectangle {
background: root.color;
// ^warning{The property 'color' has been deprecated. Please use 'background' instead}
animate color {
// ^warning{The property 'color' has been deprecated. Please use 'background' instead}
duration: 250ms;
}
}
}

View file

@ -41,7 +41,7 @@ export Button := Rectangle {
border_radius: 2px;
border_color: Palette.text_color;
background: !self.enabled ? Palette.button_background_disabled: self.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; }
animate background { duration: 100ms; }
horizontal-stretch: 0;
vertical-stretch: 0;
@ -92,7 +92,7 @@ export CheckBox := Rectangle {
border_radius: root.height / 2;
border_color: root.enabled ? (root.checked ? Palette.highlight_background : black) : Palette.text_color_disabled;
background: root.checked ? (root.enabled ? Palette.highlight_background : Palette.text_color_disabled) : white;
animate color { duration: 100ms; }
animate background { duration: 100ms; }
bubble := Rectangle {
width: root.height - 8px;
@ -102,7 +102,7 @@ export CheckBox := Rectangle {
x: 4px + a * (indicator.width - bubble.width - 8px);
property <float> a: root.checked ? 1 : 0;
background: root.checked ? white : (root.enabled ? Palette.button_background : Palette.text_color_disabled);
animate a, color { duration: 200ms; easing: ease;}
animate a, background { duration: 200ms; easing: ease;}
}
}
@ -137,7 +137,7 @@ SpinBoxButton := Rectangle {
border_radius: 2px;
border_color: black;
background: !enabled ? Palette.button_background_disabled : touch.pressed ? Palette.button_pressed : (touch.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; }
animate background { duration: 100ms; }
touch := TouchArea {
clicked => {
if (enabled) {
@ -255,7 +255,7 @@ export Slider := Rectangle {
border_radius: 3px;
border_color: black;
background: (touch_area.pressed && enabled) ? Palette.button_pressed : white;
animate color { duration: 100ms; }
animate background { duration: 100ms; }
x: (root.width - handle.width) * (new_value - minimum)/(maximum - minimum);
property<float> new_value_tmp : (touch_area.pressed && enabled)
? root.value + (touch_area.mouse_x - touch_area.pressed_x) * (maximum - minimum) / (root.width - handle.width)
@ -366,7 +366,7 @@ ScrollBar := Rectangle {
border_radius: (horizontal ? self.height : self.width) / 2;
background: touch_area.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; }
animate background { duration: 100ms; }
x: !horizontal ? 0phx : (root.width - handle.width) * (new_value / max);
y: horizontal ? 0phx : (root.height - handle.height) * (new_value / max);
property<length> new_value_tmp : -root.value + (
@ -466,7 +466,7 @@ export ComboBox := Rectangle {
border_radius: 2px;
border_color: Palette.text_color;
background: !enabled ? Palette.button_background_disabled : touch_area.pressed ? Palette.button_pressed : (touch_area.has_hover ? Palette.button_hover : Palette.button_background);
animate color { duration: 100ms; }
animate background { duration: 100ms; }
horizontal-stretch: 0;
vertical-stretch: 0;
minimum_width: 170px;