add status style feature patch

Signed-off-by: sunfei <sunfei.sun@huawei.com>
Change-Id:  I8811578fa742023c67655d283bb88aed7aac422c
This commit is contained in:
kouxinxin 2021-12-04 11:32:35 +08:00 committed by sunfei
parent 7775d1ece3
commit d6c48da20b
26 changed files with 791 additions and 126 deletions

View File

@ -32,6 +32,7 @@ config("ace_config") {
]
}
defines = ace_common_defines
defines += [ "USE_STATE_STYLE_UPDATER" ]
if (is_wearable_product) {
defines += ace_wearable_defines

View File

@ -295,12 +295,15 @@ void JSButton::JsBackgroundColor(const JSCallbackInfo& info)
LOGE("Button component create failed");
return;
}
buttonComponent->SetBackgroundColor(backgroundColor);
auto buttonTheme = GetTheme<ButtonTheme>();
if (buttonTheme) {
Color blendColor = buttonTheme->GetClickedColor();
buttonComponent->SetClickedColor(buttonComponent->GetBackgroundColor().BlendColor(blendColor));
auto state = GetState(info, 1);
if (state != StyleState::PRESSED) {
auto buttonTheme = GetTheme<ButtonTheme>();
if (buttonTheme) {
Color blendColor = buttonTheme->GetClickedColor();
buttonComponent->SetClickedColor(buttonComponent->GetBackgroundColor().BlendColor(blendColor));
}
}
buttonComponent->SetColorForState(backgroundColor, GetState(info, 1));
info.ReturnSelf();
}
@ -315,7 +318,7 @@ void JSButton::JsWidth(const JSCallbackInfo& info)
auto option = stack->GetImplicitAnimationOption();
auto buttonComponent = AceType::DynamicCast<ButtonComponent>(stack->GetMainComponent());
if (buttonComponent) {
buttonComponent->SetWidth(value, option);
buttonComponent->SetWidthForState(value, option, GetState(info, 1));
}
}
@ -330,7 +333,7 @@ void JSButton::JsHeight(const JSCallbackInfo& info)
auto option = stack->GetImplicitAnimationOption();
auto buttonComponent = AceType::DynamicCast<ButtonComponent>(stack->GetMainComponent());
if (buttonComponent) {
buttonComponent->SetHeight(value, option);
buttonComponent->SetHeightForState(value, option, GetState(info, 1));
}
}
@ -382,8 +385,9 @@ void JSButton::JsRadius(const JSCallbackInfo& info)
return;
}
buttonComponent->SetRadiusState(true);
buttonComponent->SetRectRadius(radius);
JSViewAbstract::SetBorderRadius(radius, stack->GetImplicitAnimationOption());
buttonComponent->SetRectRadiusForState(radius, GetState(info, 1));
auto boxComponent = AceType::DynamicCast<BoxComponent>(stack->GetBoxComponent());
boxComponent->SetBorderRadiusForState(radius, stack->GetImplicitAnimationOption(), GetState(info, 1));
}
Dimension JSButton::GetSizeValue(const JSCallbackInfo& info)

View File

@ -107,14 +107,12 @@ void JSFlex::JsHeight(const JSCallbackInfo& info)
LOGE("The arg is wrong, it is supposed to have atleast 1 arguments");
return;
}
JSViewAbstract::JsHeight(info);
SetHeight(info[0]);
}
void JSFlex::SetHeight(const JSRef<JSVal>& jsValue)
{
JSViewAbstract::JsHeight(jsValue);
auto component = ViewStackProcessor::GetInstance()->GetMainComponent();
auto columComponent = AceType::DynamicCast<ColumnComponent>(component);
auto rowComponent = AceType::DynamicCast<RowComponent>(component);
@ -133,13 +131,12 @@ void JSFlex::JsWidth(const JSCallbackInfo& info)
return;
}
JSViewAbstract::JsWidth(info);
SetWidth(info[0]);
}
void JSFlex::SetWidth(const JSRef<JSVal>& jsValue)
{
JSViewAbstract::JsWidth(jsValue);
auto component = ViewStackProcessor::GetInstance()->GetMainComponent();
auto columComponent = AceType::DynamicCast<ColumnComponent>(component);
auto rowComponent = AceType::DynamicCast<RowComponent>(component);
@ -164,7 +161,9 @@ void JSFlex::JsSize(const JSCallbackInfo& info)
}
JSRef<JSObject> sizeObj = JSRef<JSObject>::Cast(info[0]);
JSViewAbstract::JsWidth(info);
SetWidth(sizeObj->GetProperty("width"));
JSViewAbstract::JsHeight(info);
SetHeight(sizeObj->GetProperty("height"));
}

View File

@ -164,12 +164,12 @@ void JSFlexImpl::JsFlexWidth(const JSCallbackInfo& info)
return;
}
JSViewAbstract::JsWidth(info);
JsFlexWidth(info[0]);
}
void JSFlexImpl::JsFlexWidth(const JSRef<JSVal>& jsValue)
{
JSViewAbstract::JsWidth(jsValue);
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
auto widthVal = box->GetWidth();
auto mainComponent = ViewStackProcessor::GetInstance()->GetMainComponent();
@ -195,12 +195,12 @@ void JSFlexImpl::JsFlexHeight(const JSCallbackInfo& info)
return;
}
JSViewAbstract::JsHeight(info);
JsFlexHeight(info[0]);
}
void JSFlexImpl::JsFlexHeight(const JSRef<JSVal>& jsValue)
{
JSViewAbstract::JsHeight(jsValue);
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
auto heightVal = box->GetHeight();
auto mainComponent = ViewStackProcessor::GetInstance()->GetMainComponent();
@ -232,7 +232,9 @@ void JSFlexImpl::JsFlexSize(const JSCallbackInfo& info)
}
JSRef<JSObject> sizeObj = JSRef<JSObject>::Cast(info[0]);
JSViewAbstract::JsWidth(info);
JsFlexWidth(sizeObj->GetProperty("width"));
JSViewAbstract::JsHeight(info);
JsFlexHeight(sizeObj->GetProperty("height"));
}

View File

@ -175,7 +175,7 @@ void JSImage::SetBorderRadius(const Dimension& value)
SetBorder(border);
}
void JSImage::SetBorderStyle(int32_t style)
void JSImage::SetBorderStyle(int32_t style, StyleState state)
{
BorderStyle borderStyle = BorderStyle::SOLID;
@ -191,7 +191,13 @@ void JSImage::SetBorderStyle(int32_t style)
BorderEdge edge = GetLeftBorderEdge();
edge.SetStyle(borderStyle);
SetBorderEdge(edge);
auto stack = ViewStackProcessor::GetInstance();
auto box = stack->GetBoxComponent();
if (state == StyleState::NORMAL) {
SetBorderEdge(edge);
} else {
box->SetBorderStyleForState(borderStyle, state);
}
}
void JSImage::SetBorderColor(const Color& color)
@ -276,7 +282,28 @@ void JSImage::JsBorderColor(const JSCallbackInfo& info)
if (!ParseJsColor(info[0], borderColor)) {
return;
}
SetBorderColor(borderColor);
auto stack_ = ViewStackProcessor::GetInstance();
auto box = stack_->GetBoxComponent();
auto state = GetState(info, 1);
if (state == StyleState::NORMAL) {
SetBorderColor(borderColor);
} else {
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetBorderColorForState(borderColor, option, state);
}
}
void JSImage::JsBorderStyle(const JSCallbackInfo& info)
{
if (info.Length() < 1) {
LOGE("The arg is wrong, it is supposed to have at least 1 arguments");
return;
}
if (!info[0]->IsNumber()) {
LOGE("arg is not a object.");
return;
}
SetBorderStyle(info[0]->ToNumber<int32_t>(), GetState(info, 1));
}
void JSImage::OnComplete(const JSCallbackInfo& args)
@ -286,12 +313,12 @@ void JSImage::OnComplete(const JSCallbackInfo& args)
auto jsLoadSuccFunc = AceType::MakeRefPtr<JsEventFunction<LoadImageSuccessEvent, 1>>(
JSRef<JSFunc>::Cast(args[0]), LoadImageSuccEventToJSValue);
auto image = AceType::DynamicCast<ImageComponent>(ViewStackProcessor::GetInstance()->GetMainComponent());
image->SetLoadSuccessEvent(EventMarker([execCtx = args.GetExecutionContext(), func = std::move(jsLoadSuccFunc)]
(const BaseEventInfo* info) {
JAVASCRIPT_EXECUTION_SCOPE_WITH_CHECK(execCtx);
auto eventInfo = TypeInfoHelper::DynamicCast<LoadImageSuccessEvent>(info);
func->Execute(*eventInfo);
}));
image->SetLoadSuccessEvent(EventMarker(
[execCtx = args.GetExecutionContext(), func = std::move(jsLoadSuccFunc)](const BaseEventInfo* info) {
JAVASCRIPT_EXECUTION_SCOPE_WITH_CHECK(execCtx);
auto eventInfo = TypeInfoHelper::DynamicCast<LoadImageSuccessEvent>(info);
func->Execute(*eventInfo);
}));
} else {
LOGE("args not function");
}
@ -304,12 +331,12 @@ void JSImage::OnError(const JSCallbackInfo& args)
auto jsLoadFailFunc = AceType::MakeRefPtr<JsEventFunction<LoadImageFailEvent, 1>>(
JSRef<JSFunc>::Cast(args[0]), LoadImageFailEventToJSValue);
auto image = AceType::DynamicCast<ImageComponent>(ViewStackProcessor::GetInstance()->GetMainComponent());
image->SetLoadFailEvent(EventMarker([execCtx = args.GetExecutionContext(), func = std::move(jsLoadFailFunc)]
(const BaseEventInfo* info) {
JAVASCRIPT_EXECUTION_SCOPE_WITH_CHECK(execCtx);
auto eventInfo = TypeInfoHelper::DynamicCast<LoadImageFailEvent>(info);
func->Execute(*eventInfo);
}));
image->SetLoadFailEvent(EventMarker(
[execCtx = args.GetExecutionContext(), func = std::move(jsLoadFailFunc)](const BaseEventInfo* info) {
JAVASCRIPT_EXECUTION_SCOPE_WITH_CHECK(execCtx);
auto eventInfo = TypeInfoHelper::DynamicCast<LoadImageFailEvent>(info);
func->Execute(*eventInfo);
}));
} else {
LOGE("args not function");
}
@ -362,7 +389,15 @@ void JSImage::JsBorderWidth(const JSCallbackInfo& info)
if (!ParseJsDimensionVp(info[0], borderWidth)) {
return;
}
SetBorderWidth(borderWidth);
auto stack_ = ViewStackProcessor::GetInstance();
auto box = stack_->GetBoxComponent();
auto state = GetState(info, 1);
if (state == StyleState::NORMAL) {
SetBorderWidth(borderWidth);
} else {
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetBorderWidthForState(borderWidth, option, state);
}
}
void JSImage::JsBorderRadius(const JSCallbackInfo& info)
@ -375,7 +410,15 @@ void JSImage::JsBorderRadius(const JSCallbackInfo& info)
if (!ParseJsDimensionVp(info[0], borderRadius)) {
return;
}
SetBorderRadius(borderRadius);
auto stack_ = ViewStackProcessor::GetInstance();
auto box = stack_->GetBoxComponent();
auto state = GetState(info, 1);
if (state == StyleState::NORMAL) {
SetBorderRadius(borderRadius);
} else {
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetBorderRadiusForState(borderRadius, option, state);
}
}
void JSImage::JsBorder(const JSCallbackInfo& info)
@ -400,13 +443,13 @@ void JSImage::JsBorder(const JSCallbackInfo& info)
ParseJsonDimensionVp(argsPtrItem->GetValue("width"), width);
ParseJsonDimensionVp(argsPtrItem->GetValue("radius"), radius);
auto borderStyle = argsPtrItem->GetInt("style", static_cast<int32_t>(BorderStyle::SOLID));
LOGD("JsBorder width = %lf unit = %d, radius = %lf unit = %d, borderStyle = %d", width.Value(),
width.Unit(), radius.Value(), radius.Unit(), borderStyle);
LOGD("JsBorder width = %lf unit = %d, radius = %lf unit = %d, borderStyle = %d", width.Value(), width.Unit(),
radius.Value(), radius.Unit(), borderStyle);
Color color;
if (ParseJsonColor(argsPtrItem->GetValue("color"), color)) {
SetBorderColor(color);
}
SetBorderStyle(borderStyle);
SetBorderStyle(borderStyle, GetState(info, 1));
SetBorderWidth(width);
SetBorderRadius(radius);
info.SetReturnValue(info.This());

View File

@ -58,6 +58,7 @@ public:
static void SetSyncLoad(const JSCallbackInfo& info);
static void JsBorderColor(const JSCallbackInfo& info);
static void JsBorderStyle(const JSCallbackInfo& info);
static void JsPadding(const JSCallbackInfo& info);
static void JsMargin(const JSCallbackInfo& info);
static void ParseMarginOrPadding(const JSCallbackInfo& info, bool isMargin);
@ -102,7 +103,7 @@ protected:
static void SetPaddingRight(const std::string& value);
static void SetPadding(const std::string& value);
static void SetBackgroundColor(const Color& color);
static void SetBorderStyle(int32_t style);
static void SetBorderStyle(int32_t style, StyleState state);
static void SetBorderColor(const Color& color);
static void SetLeftBorderColor(const Color& color);
static void SetTopBorderColor(const Color& color);

View File

@ -99,11 +99,10 @@ void JSStack::SetWidth(const JSCallbackInfo& info)
LOGE("The arg is wrong, it is supposed to have at least 1 arguments");
return;
}
SetWidth(info[0]);
JsStackWidth(info[0], info);
}
void JSStack::SetWidth(const JSRef<JSVal>& jsValue)
void JSStack::JsStackWidth(const JSRef<JSVal>& jsValue, const JSCallbackInfo& info)
{
Dimension value;
if (!ConvertFromJSValue(jsValue, value)) {
@ -116,7 +115,7 @@ void JSStack::SetWidth(const JSRef<JSVal>& jsValue)
}
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetWidth(value, option);
box->SetWidthForState(value, option, GetState(info, 1));
auto stack = AceType::DynamicCast<StackComponent>(ViewStackProcessor::GetInstance()->GetMainComponent());
if (stack) {
@ -134,15 +133,14 @@ void JSStack::SetHeight(const JSCallbackInfo& info)
LOGE("The arg is wrong, it is supposed to have at least 1 arguments");
return;
}
SetHeight(info[0]);
JsStackHeight(info[0], info);
}
void JSStack::SetHeight(const JSRef<JSVal>& jsValue)
void JSStack::JsStackHeight(const JSRef<JSVal>& jsValue, const JSCallbackInfo& info)
{
Dimension value;
if (!ConvertFromJSValue(jsValue, value)) {
LOGE("args can not set width");
LOGE("args can not set height");
return;
}
@ -151,7 +149,7 @@ void JSStack::SetHeight(const JSRef<JSVal>& jsValue)
}
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetHeight(value, option);
box->SetHeightForState(value, option, GetState(info, 1));
auto stack = AceType::DynamicCast<StackComponent>(ViewStackProcessor::GetInstance()->GetMainComponent());
if (stack) {
@ -176,8 +174,8 @@ void JSStack::SetSize(const JSCallbackInfo& info)
}
JSRef<JSObject> sizeObj = JSRef<JSObject>::Cast(info[0]);
SetWidth(sizeObj->GetProperty("width"));
SetHeight(sizeObj->GetProperty("height"));
JsStackWidth(sizeObj->GetProperty("width"), info);
JsStackHeight(sizeObj->GetProperty("height"), info);
}
void JSStack::JSBind(BindingTarget globalObj)

View File

@ -30,8 +30,8 @@ public:
static void SetAlignment(int value);
static void SetWidth(const JSCallbackInfo& info);
static void SetHeight(const JSCallbackInfo& info);
static void SetWidth(const JSRef<JSVal>& jsValue);
static void SetHeight(const JSRef<JSVal>& jsValue);
static void JsStackWidth(const JSRef<JSVal>& jsValue, const JSCallbackInfo& info);
static void JsStackHeight(const JSRef<JSVal>& jsValue, const JSCallbackInfo& info);
static void SetSize(const JSCallbackInfo& info);
};

View File

@ -33,6 +33,7 @@
#include "bridge/declarative_frontend/jsview/js_view_register.h"
#include "bridge/declarative_frontend/view_stack_processor.h"
#include "core/common/ace_application_info.h"
#include "core/components/box/box_component_helper.h"
#include "core/components/common/layout/align_declaration.h"
#include "core/components/common/properties/motion_path_option.h"
#include "core/components/menu/menu_component.h"
@ -485,6 +486,22 @@ uint32_t ColorAlphaAdapt(uint32_t origin)
return result;
}
StyleState JSViewAbstract::GetState(const JSCallbackInfo& info, int32_t index)
{
if (info.Length() == (index + 1) && info[index]->IsString()) {
auto state = info[index]->ToString();
if (state == "pressed") {
return StyleState::PRESSED;
} else if (state == "disabled") {
return StyleState::DISABLED;
} else {
return StyleState::NORMAL;
}
} else {
return StyleState::NORMAL;
}
}
void JSViewAbstract::JsScale(const JSCallbackInfo& info)
{
LOGD("JsScale");
@ -577,7 +594,7 @@ void JSViewAbstract::JsOpacity(const JSCallbackInfo& info)
auto display = ViewStackProcessor::GetInstance()->GetDisplayComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
display->SetOpacity(opacity, option);
display->SetOpacity(opacity, option, GetState(info, 1));
}
void JSViewAbstract::JsTranslate(const JSCallbackInfo& info)
@ -806,10 +823,10 @@ void JSViewAbstract::JsWidth(const JSCallbackInfo& info)
return;
}
JsWidth(info[0]);
JsWidth(info[0], GetState(info, 1));
}
bool JSViewAbstract::JsWidth(const JSRef<JSVal>& jsValue)
bool JSViewAbstract::JsWidth(const JSRef<JSVal>& jsValue, StyleState state)
{
Dimension value;
if (!ParseJsDimensionVp(jsValue, value)) {
@ -828,9 +845,11 @@ bool JSViewAbstract::JsWidth(const JSRef<JSVal>& jsValue)
renderComponent->SetIsPercentSize(isPercentSize);
}
}
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetWidth(value, option);
auto stack = ViewStackProcessor::GetInstance();
auto box = stack->GetBoxComponent();
AnimationOption option = stack->GetImplicitAnimationOption();
box->SetWidthForState(value, option, state);
return true;
}
@ -841,10 +860,10 @@ void JSViewAbstract::JsHeight(const JSCallbackInfo& info)
return;
}
JsHeight(info[0]);
JsHeight(info[0], GetState(info, 1));
}
bool JSViewAbstract::JsHeight(const JSRef<JSVal>& jsValue)
bool JSViewAbstract::JsHeight(const JSRef<JSVal>& jsValue, StyleState state)
{
Dimension value;
if (!ParseJsDimensionVp(jsValue, value)) {
@ -864,9 +883,10 @@ bool JSViewAbstract::JsHeight(const JSRef<JSVal>& jsValue)
}
}
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetHeight(value, option);
auto stack = ViewStackProcessor::GetInstance();
auto box = stack->GetBoxComponent();
AnimationOption option = stack->GetImplicitAnimationOption();
box->SetHeightForState(value, option, state);
return true;
}
@ -999,8 +1019,9 @@ void JSViewAbstract::JsSize(const JSCallbackInfo& info)
}
JSRef<JSObject> sizeObj = JSRef<JSObject>::Cast(info[0]);
JsWidth(sizeObj->GetProperty("width"));
JsHeight(sizeObj->GetProperty("height"));
auto state = GetState(info, 1);
JsWidth(sizeObj->GetProperty("width"), state);
JsHeight(sizeObj->GetProperty("height"), state);
}
void JSViewAbstract::JsConstraintSize(const JSCallbackInfo& info)
@ -1449,8 +1470,11 @@ void JSViewAbstract::JsBorderColor(const JSCallbackInfo& info)
if (!ParseJsColor(info[0], borderColor)) {
return;
}
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
SetBorderColor(borderColor, option);
auto stack = ViewStackProcessor::GetInstance();
AnimationOption option = stack->GetImplicitAnimationOption();
auto boxComponent = stack->GetBoxComponent();
boxComponent->SetBorderColorForState(borderColor, option, GetState(info, 1));
}
void JSViewAbstract::JsBackgroundColor(const JSCallbackInfo& info)
@ -1463,9 +1487,11 @@ void JSViewAbstract::JsBackgroundColor(const JSCallbackInfo& info)
if (!ParseJsColor(info[0], backgroundColor)) {
return;
}
auto box = ViewStackProcessor::GetInstance()->GetBoxComponent();
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
box->SetColor(backgroundColor, option);
auto stack = ViewStackProcessor::GetInstance();
AnimationOption option = stack->GetImplicitAnimationOption();
auto boxComponent = stack->GetBoxComponent();
boxComponent->SetColor(backgroundColor, option, GetState(info, 1));
}
void JSViewAbstract::JsBackgroundImage(const JSCallbackInfo& info)
@ -1765,23 +1791,25 @@ void JSViewAbstract::JsBorder(const JSCallbackInfo& info)
return;
}
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
auto stack = ViewStackProcessor::GetInstance();
AnimationOption option = stack->GetImplicitAnimationOption();
auto boxComponent = AceType::DynamicCast<BoxComponent>(stack->GetBoxComponent());
Dimension width;
if (argsPtrItem->Contains("width") && ParseJsonDimensionVp(argsPtrItem->GetValue("width"), width)) {
SetBorderWidth(width, option);
boxComponent->SetBorderWidthForState(width, option, GetState(info, 1));
}
Color color;
if (argsPtrItem->Contains("color") && ParseJsonColor(argsPtrItem->GetValue("color"), color)) {
SetBorderColor(color, option);
boxComponent->SetBorderColorForState(color, option, GetState(info, 1));
}
Dimension radius;
if (argsPtrItem->Contains("radius") && ParseJsonDimensionVp(argsPtrItem->GetValue("radius"), radius)) {
SetBorderRadius(radius, option);
boxComponent->SetBorderRadiusForState(radius, option, GetState(info, 1));
}
if (argsPtrItem->Contains("style")) {
auto borderStyle = argsPtrItem->GetInt("style", static_cast<int32_t>(BorderStyle::SOLID));
SetBorderStyle(borderStyle);
JsBorderStyle(borderStyle, GetState(info, 1)); // takes care of visualStyle
}
info.ReturnSelf();
}
@ -1796,8 +1824,10 @@ void JSViewAbstract::JsBorderWidth(const JSCallbackInfo& info)
if (!ParseJsDimensionVp(info[0], borderWidth)) {
return;
}
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
SetBorderWidth(borderWidth, option);
auto stack = ViewStackProcessor::GetInstance();
AnimationOption option = stack->GetImplicitAnimationOption();
auto boxComponent = AceType::DynamicCast<BoxComponent>(stack->GetBoxComponent());
boxComponent->SetBorderWidthForState(borderWidth, option, GetState(info, 1));
}
void JSViewAbstract::JsBorderRadius(const JSCallbackInfo& info)
@ -1811,7 +1841,8 @@ void JSViewAbstract::JsBorderRadius(const JSCallbackInfo& info)
return;
}
AnimationOption option = ViewStackProcessor::GetInstance()->GetImplicitAnimationOption();
SetBorderRadius(borderRadius, option);
auto boxComponent = AceType::DynamicCast<BoxComponent>(ViewStackProcessor::GetInstance()->GetBoxComponent());
boxComponent->SetBorderRadiusForState(borderRadius, option, GetState(info, 1));
}
void JSViewAbstract::JsBlur(const JSCallbackInfo& info)
@ -2735,10 +2766,9 @@ void JSViewAbstract::JsLinearGradient(const JSCallbackInfo& info)
lineGradient.SetRepeat(repeating);
// color stops
GetGradientColorStops(lineGradient, argsPtrItem->GetValue("colors"));
auto decoration = GetBackDecoration();
if (decoration) {
decoration->SetGradient(lineGradient);
}
auto boxComponent = ViewStackProcessor::GetInstance()->GetBoxComponent();
boxComponent->SetGradientForState(lineGradient, GetState(info, 1));
}
void JSViewAbstract::JsRadialGradient(const JSCallbackInfo& info)
@ -2794,10 +2824,9 @@ void JSViewAbstract::JsRadialGradient(const JSCallbackInfo& info)
radialGradient.SetRepeat(repeating);
// color stops
GetGradientColorStops(radialGradient, argsPtrItem->GetValue("colors"));
auto decoration = GetBackDecoration();
if (decoration) {
decoration->SetGradient(radialGradient);
}
auto boxComponent = ViewStackProcessor::GetInstance()->GetBoxComponent();
boxComponent->SetGradientForState(radialGradient, GetState(info, 1));
}
void JSViewAbstract::JsSweepGradient(const JSCallbackInfo& info)
@ -2866,10 +2895,8 @@ void JSViewAbstract::JsSweepGradient(const JSCallbackInfo& info)
sweepGradient.SetRepeat(repeating);
// color stops
GetGradientColorStops(sweepGradient, argsPtrItem->GetValue("colors"));
auto decoration = GetBackDecoration();
if (decoration) {
decoration->SetGradient(sweepGradient);
}
auto boxComponent = ViewStackProcessor::GetInstance()->GetBoxComponent();
boxComponent->SetGradientForState(sweepGradient, GetState(info, 1));
}
void JSViewAbstract::JsMotionPath(const JSCallbackInfo& info)
@ -3413,14 +3440,20 @@ void JSViewAbstract::SetBorder(const Border& border)
GetBackDecoration()->SetBorder(border);
}
void JSViewAbstract::SetBorderRadius(const Dimension& value, const AnimationOption& option)
void JSViewAbstract::SetBorderStyle(const JSCallbackInfo& info)
{
Border border = GetBorder();
border.SetBorderRadius(Radius(AnimatableDimension(value, option)));
SetBorder(border);
if (info.Length() < 1) {
LOGE("The arg is wrong, it is supposed to have at least 1 arguments");
return;
}
if (!info[0]->IsNumber()) {
LOGE("arg is not a object.");
return;
}
JsBorderStyle(info[0]->ToNumber<int32_t>(), GetState(info, 1));
}
void JSViewAbstract::SetBorderStyle(int32_t style)
void JSViewAbstract::JsBorderStyle(int32_t style, StyleState state)
{
BorderStyle borderStyle = BorderStyle::SOLID;
@ -3433,19 +3466,20 @@ void JSViewAbstract::SetBorderStyle(int32_t style)
} else {
borderStyle = BorderStyle::NONE;
}
Border border = GetBorder();
border.SetStyle(borderStyle);
SetBorder(border);
auto stack = ViewStackProcessor::GetInstance();
auto boxComponent = AceType::DynamicCast<BoxComponent>(stack->GetBoxComponent());
boxComponent->SetBorderStyleForState(borderStyle, state);
}
void JSViewAbstract::SetBorderColor(const Color& color, const AnimationOption& option)
void JSViewAbstract::SetBorderColor(const Color& color, const AnimationOption& option, StyleState state)
{
auto border = GetBorder();
border.SetColor(color, option);
SetBorder(border);
}
void JSViewAbstract::SetBorderWidth(const Dimension& value, const AnimationOption& option)
void JSViewAbstract::SetBorderWidth(const Dimension& value, const AnimationOption& option, StyleState state)
{
auto border = GetBorder();
border.SetWidth(value, option);

View File

@ -202,6 +202,7 @@ public:
static void JSBind();
protected:
static StyleState GetState(const JSCallbackInfo& info, int32_t index);
/**
* box properties setter
*/
@ -217,18 +218,19 @@ protected:
static void SetPaddingLeft(const JSCallbackInfo& info);
static void SetPaddingRight(const JSCallbackInfo& info);
static void SetBorder(const Border& border);
static void SetBorderStyle(int32_t style);
static void SetBorderRadius(const Dimension& value, const AnimationOption& option);
static void SetBorderColor(const Color& color, const AnimationOption& option);
static void SetBorderWidth(const Dimension& value, const AnimationOption& option);
static void SetBorderStyle(const JSCallbackInfo& info);
static void JsBorderStyle(int32_t style, StyleState state);
static void SetBorderRadius(const Dimension& value, const AnimationOption& option, StyleState state);
static void SetBorderColor(const Color& color, const AnimationOption& option, StyleState state);
static void SetBorderWidth(const Dimension& value, const AnimationOption& option, StyleState state);
static void SetBlur(float radius);
static void SetColorBlend(Color color);
static void SetBackdropBlur(float radius);
static void SetBlurRadius(const RefPtr<Decoration>& decoration, float radius);
static void SetWindowBlur(float progress, WindowBlurStyle blurStyle);
static RefPtr<ThemeConstants> GetThemeConstants();
static bool JsWidth(const JSRef<JSVal>& jsValue);
static bool JsHeight(const JSRef<JSVal>& jsValue);
static bool JsWidth(const JSRef<JSVal>& jsValue, StyleState state = StyleState::NORMAL);
static bool JsHeight(const JSRef<JSVal>& jsValue, StyleState state = StyleState::NORMAL);
template<typename T>
static RefPtr<T> GetTheme()
{

View File

@ -24,9 +24,21 @@
namespace OHOS::Ace {
using OnDragFunc = std::function<void(const RefPtr<DragEvent>& info)>;
enum class BoxStateAttribute {
ASPECTRATIO,
BORDER,
COLOR,
BORDER_COLOR,
BORDER_RADIUS,
BORDER_STYLE,
BORDER_WIDTH,
GRADIENT,
HEIGHT,
WIDTH,
};
// A component can box others components.
class ACE_EXPORT BoxComponent : public BoxBaseComponent {
DECLARE_ACE_TYPE(BoxComponent, BoxBaseComponent);
@ -75,12 +87,11 @@ public:
SetDecorationUpdateFlag(true);
}
void SetColor(const Color& color, const AnimationOption& option = AnimationOption())
void SetColor(
const Color& color, const AnimationOption& option = AnimationOption(), StyleState state = StyleState::NORMAL)
{
if (!backDecoration_) {
backDecoration_ = AceType::MakeRefPtr<Decoration>();
}
backDecoration_->SetBackgroundColor(color, option);
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableColor>>(
state, BoxStateAttribute::COLOR, AnimatableColor(color, option)));
}
void SetColor(const AnimatableColor& color)
@ -246,6 +257,61 @@ public:
return geometryTransitionId_;
}
RefPtr<StateAttributeList<BoxStateAttribute>> GetStateAttributeList()
{
if (stateAttributeList_ == nullptr) {
stateAttributeList_ = MakeRefPtr<StateAttributeList<BoxStateAttribute>>();
}
return stateAttributeList_;
}
bool HasStateAttributeList()
{
return stateAttributeList_ != nullptr;
}
void SetWidthForState(const Dimension& width, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(
state, BoxStateAttribute::WIDTH, AnimatableDimension(width, option)));
}
void SetHeightForState(const Dimension& height, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(
state, BoxStateAttribute::HEIGHT, AnimatableDimension(height, option)));
}
void SetBorderColorForState(const Color& color, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableColor>>(
state, BoxStateAttribute::BORDER_COLOR, AnimatableColor(color, option)));
}
void SetBorderRadiusForState(const Dimension& radius, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(
state, BoxStateAttribute::BORDER_RADIUS, AnimatableDimension(radius, option)));
}
void SetBorderStyleForState(BorderStyle style, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, BorderStyle>>(
state, BoxStateAttribute::BORDER_STYLE, style));
}
void SetBorderWidthForState(const Dimension& width, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(
state, BoxStateAttribute::BORDER_WIDTH, AnimatableDimension(width, option)));
}
void SetGradientForState(const Gradient& value, StyleState state)
{
GetStateAttributeList()->push_back(
MakeRefPtr<StateAttributeValue<BoxStateAttribute, Gradient>>(state, BoxStateAttribute::GRADIENT, value));
}
private:
RefPtr<Decoration> backDecoration_;
RefPtr<Decoration> frontDecoration_;
@ -263,6 +329,7 @@ private:
EventMarker onDomDragLeaveId_;
EventMarker onDomDragDropId_;
std::string geometryTransitionId_;
RefPtr<StateAttributeList<BoxStateAttribute>> stateAttributeList_ = nullptr;
TextDirection inspectorDirection_ { TextDirection::LTR };
};

View File

@ -0,0 +1,88 @@
/*
* Copyright (c) 2021 Huawei Device Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
#ifndef FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_BOX_BOX_COMPONENT_HELPER_H
#define FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_BOX_BOX_COMPONENT_HELPER_H
#include "core/components/common/properties/color.h"
#include "core/components/common/properties/decoration.h"
// Helper class for updating of the attributes for Box Component
// Used by RenderBox and by JSViewAbstract
namespace OHOS::Ace {
class BoxComponentHelper {
public:
static void SetBorderColor(
RefPtr<Decoration>& backDecoration, const Color& color, const AnimationOption& option = AnimationOption())
{
if (!backDecoration) {
backDecoration = AceType::MakeRefPtr<Decoration>();
}
Border border = backDecoration->GetBorder();
BorderEdge edge;
edge = border.Left();
edge.SetColor(color, option);
border.SetLeftEdge(edge);
border.SetRightEdge(edge);
border.SetTopEdge(edge);
border.SetBottomEdge(edge);
backDecoration->SetBorder(border);
}
static void SetBorderRadius(
RefPtr<Decoration>& backDecoration, const Dimension& radius, const AnimationOption& option = AnimationOption())
{
if (!backDecoration) {
backDecoration = AceType::MakeRefPtr<Decoration>();
}
Border border = backDecoration->GetBorder();
border.SetBorderRadius(Radius(AnimatableDimension(radius, option)));
backDecoration->SetBorder(border);
}
static void SetBorderStyle(RefPtr<Decoration>& backDecoration, BorderStyle style)
{
if (!backDecoration) {
backDecoration = AceType::MakeRefPtr<Decoration>();
}
Border border = backDecoration->GetBorder();
auto edge = border.Left();
edge.SetStyle(style);
border.SetLeftEdge(edge);
border.SetRightEdge(edge);
border.SetTopEdge(edge);
border.SetBottomEdge(edge);
backDecoration->SetBorder(border);
}
static void SetBorderWidth(
RefPtr<Decoration>& backDecoration, const Dimension& width, const AnimationOption& option = AnimationOption())
{
if (!backDecoration) {
backDecoration = AceType::MakeRefPtr<Decoration>();
}
Border border = backDecoration->GetBorder();
border.SetWidth(width, option);
backDecoration->SetBorder(border);
}
};
} // namespace OHOS::Ace
#endif // FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_BOX_BOX_COMPONENT_HELPER_H

View File

@ -22,6 +22,7 @@
#include "base/utils/utils.h"
#include "core/animation/property_animatable_helper.h"
#include "core/components/box/box_component.h"
#include "core/components/box/box_component_helper.h"
#include "core/components/root/root_element.h"
#include "core/components/text_field/render_text_field.h"
#include "core/components_v2/inspector/inspector_composed_element.h"
@ -109,6 +110,26 @@ void RenderBox::Update(const RefPtr<Component>& component)
auto gestures = box->GetGestures();
UpdateGestureRecognizer(gestures);
#ifdef USE_STATE_STYLE_UPDATER
if (box->HasStateAttributeList()) {
stateAttributeList_ = box->GetStateAttributeList();
}
OnStatusStyleChanged(disabled_ ? StyleState::DISABLED : StyleState::NORMAL);
auto wp = AceType::WeakClaim(this);
touchRecognizer_ = AceType::MakeRefPtr<RawRecognizer>();
touchRecognizer_->SetOnTouchDown([wp](const TouchEventInfo&) {
auto box = wp.Upgrade();
if (box) {
box->HandleTouchEvent(true);
}
});
touchRecognizer_->SetOnTouchUp([wp](const TouchEventInfo&) {
auto box = wp.Upgrade();
if (box) {
box->HandleTouchEvent(false);
}
});
#endif
}
// In each update, the extensions will be updated with new one.
if (eventExtensions_ && eventExtensions_->HasOnAreaChangeExtension()) {
@ -119,7 +140,16 @@ void RenderBox::Update(const RefPtr<Component>& component)
}
}
}
#ifdef USE_STATE_STYLE_UPDATER
void RenderBox::HandleTouchEvent(bool isTouchDown)
{
if (isTouchDown) {
OnStatusStyleChanged(StyleState::PRESSED);
} else {
OnStatusStyleChanged(StyleState::NORMAL);
}
}
#endif
void RenderBox::CreateDragDropRecognizer()
{
if (dragDropGesture_) {
@ -142,7 +172,7 @@ void RenderBox::CreateDragDropRecognizer()
event->SetX(pipelineContext->ConvertPxToVp(Dimension(info.GetGlobalPoint().GetX(), DimensionUnit::PX)));
event->SetY(pipelineContext->ConvertPxToVp(Dimension(info.GetGlobalPoint().GetY(), DimensionUnit::PX)));
LOGW("[Engine Log] Unable to display drag events on the Previewer. Perform this operation on the "
"emulator or a real device instead.");
"emulator or a real device instead.");
onDrag(event);
}
});
@ -233,7 +263,7 @@ void RenderBox::CreateDragDropRecognizer()
});
#endif
std::vector<RefPtr<GestureRecognizer>> recognizers {longPressRecognizer, panRecognizer};
std::vector<RefPtr<GestureRecognizer>> recognizers { longPressRecognizer, panRecognizer };
dragDropGesture_ = AceType::MakeRefPtr<OHOS::Ace::SequencedRecognizer>(GetContext(), recognizers);
dragDropGesture_->SetIsExternalGesture(true);
}
@ -327,6 +357,7 @@ void RenderBox::UpdateFrontDecoration(const RefPtr<Decoration>& newDecoration)
frontDecoration_->SetHueRotate(newDecoration->GetHueRotate());
}
// TODO: OLEG align with state attributes
void RenderBox::UpdateStyleFromRenderNode(PropertyAnimatableType type)
{
// Operator map for styles
@ -662,8 +693,7 @@ void RenderBox::OnMouseHoverExitAnimation()
controllerExit_->SetFillMode(FillMode::FORWARDS);
}
void RenderBox::CreateFloatAnimation(
RefPtr<KeyframeAnimation<float>>& floatAnimation, float beginValue, float endValue)
void RenderBox::CreateFloatAnimation(RefPtr<KeyframeAnimation<float>>& floatAnimation, float beginValue, float endValue)
{
if (!floatAnimation) {
return;
@ -752,7 +782,7 @@ void RenderBox::MouseHoverExitTest()
controllerExit_->AddInterpolator(scaleAnimationExit_);
} else if (animationType_ == HoverAnimationType::BOARD) {
colorAnimationExit_ = AceType::MakeRefPtr<KeyframeAnimation<Color>>();
CreateColorAnimation(colorAnimationExit_, hoverColor_, Color::FromRGBO(0, 0, 0, 0.0));
CreateColorAnimation(colorAnimationExit_, hoverColor_, Color::FromRGBO(0, 0, 0, 0.0));
controllerExit_->AddInterpolator(colorAnimationExit_);
} else {
return;
@ -1174,8 +1204,8 @@ double RenderBox::GetWindowBlurProgress() const
return 0.0;
}
void RenderBox::AddRecognizerToResult(const Offset& coordinateOffset, const TouchRestrict& touchRestrict,
TouchTestResult& result)
void RenderBox::AddRecognizerToResult(
const Offset& coordinateOffset, const TouchRestrict& touchRestrict, TouchTestResult& result)
{
if (!ExistGestureRecognizer()) {
return;
@ -1228,6 +1258,9 @@ void RenderBox::OnTouchTestHit(
if (dragDropGesture_) {
result.emplace_back(dragDropGesture_);
}
if (touchRecognizer_) {
result.emplace_back(touchRecognizer_);
}
}
void RenderBox::UpdateGestureRecognizer(const std::array<RefPtr<Gesture>, MAX_GESTURE_SIZE>& gestures)
@ -1265,4 +1298,95 @@ bool RenderBox::ExistGestureRecognizer()
return false;
}
void RenderBox::OnStatusStyleChanged(StyleState componentState)
{
RenderBoxBase::OnStatusStyleChanged(componentState);
if (stateAttributeList_ == nullptr) {
return;
}
bool updated = false;
for (const auto& attribute : *stateAttributeList_) {
if (attribute->stateName_ != componentState) {
continue;
}
updated = true;
switch (attribute->id_) {
case BoxStateAttribute::COLOR: {
auto colorState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableColor>>(attribute);
if (!backDecoration_) {
backDecoration_ = AceType::MakeRefPtr<Decoration>();
}
backDecoration_->SetBackgroundColor(colorState->value_);
} break;
case BoxStateAttribute::BORDER_COLOR: {
auto colorState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableColor>>(attribute);
// TODO: reuse RenderBox::SetBorderColor
BoxComponentHelper::SetBorderColor(backDecoration_, colorState->value_);
} break;
case BoxStateAttribute::BORDER_RADIUS: {
auto radiusState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(attribute);
// TODO: reuse RenderBox::SetBorderRadius
BoxComponentHelper::SetBorderRadius(backDecoration_, radiusState->value_);
} break;
case BoxStateAttribute::BORDER_STYLE: {
auto attributeStateValue =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, BorderStyle>>(attribute);
// TODO: reuse RenderBox::SetBorderStyle
BoxComponentHelper::SetBorderStyle(backDecoration_, attributeStateValue->value_);
} break;
case BoxStateAttribute::BORDER_WIDTH: {
auto widthState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(attribute);
// TODO: reuse RenderBox::SetBorderWidth
BoxComponentHelper::SetBorderWidth(backDecoration_, widthState->value_);
} break;
case BoxStateAttribute::HEIGHT: {
auto valueState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(attribute);
height_ = valueState->value_;
} break;
case BoxStateAttribute::WIDTH: {
auto valueState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(attribute);
width_ = valueState->value_;
} break;
case BoxStateAttribute::ASPECTRATIO: {
auto valueState =
AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, AnimatableDimension>>(attribute);
SetAspectRatio(valueState->value_);
} break;
case BoxStateAttribute::BORDER: {
// We replace support for border object with updates to border components:
// color, style, width, radius
// The reason - developer does not have to provide all border properties
// when border is set.
// See JSViewAbstract::JsBorder for details
} break;
case BoxStateAttribute::GRADIENT: {
auto gradientState = AceType::DynamicCast<StateAttributeValue<BoxStateAttribute, Gradient>>(attribute);
if (backDecoration_) {
backDecoration_->SetGradient(gradientState->value_);
}
} break;
}
}
if (updated) {
MarkNeedLayout();
}
};
} // namespace OHOS::Ace

View File

@ -24,6 +24,7 @@
#include "core/components/common/properties/color.h"
#include "core/components/common/properties/decoration.h"
#include "core/components/image/render_image.h"
#include "core/gestures/raw_recognizer.h"
#include "base/image/pixel_map.h"
namespace OHOS::Ace {
@ -61,6 +62,9 @@ public:
});
}
#ifdef USE_STATE_STYLE_UPDATER
virtual void OnStatusStyleChanged(StyleState state) override;
#endif
void UpdateStyleFromRenderNode(PropertyAnimatableType type) override;
const Color& GetColor() const override
@ -257,6 +261,11 @@ private:
OnDragFunc onDragLeave_;
OnDragFunc onDrop_;
RefPtr<GestureRecognizer> onClick_;
#ifdef USE_STATE_STYLE_UPDATER
void HandleTouchEvent(bool isTouchDown);
RefPtr<RawRecognizer> touchRecognizer_;
RefPtr<StateAttributeList<BoxStateAttribute>> stateAttributeList_;
#endif
TextDirection inspectorDirection_ { TextDirection::LTR };
}; // class RenderBox

View File

@ -238,6 +238,11 @@ public:
return aspectRatio_.Value();
}
void SetAspectRatio(const Dimension& aspectRatio)
{
aspectRatio_ = aspectRatio;
}
const RefPtr<ClipPath>& GetClipPath() const
{
return clipPath_;

View File

@ -22,6 +22,7 @@
#include "core/components/common/layout/constants.h"
#include "core/components/common/properties/border_edge.h"
#include "core/components/common/properties/color.h"
#include "core/components/common/properties/state_attributes.h"
#include "core/pipeline/base/component_group.h"
#include "core/pipeline/base/measurable.h"
#include "frameworks/core/components/declaration/button/button_declaration.h"
@ -33,6 +34,8 @@ constexpr int32_t LAYOUT_FLAG_EXTEND_TO_PARENT = 1;
using ProgressCallback = std::function<void(uint32_t)>;
enum class ButtonStateAttribute { COLOR, RADIUS, HEIGHT, WIDTH };
class ACE_EXPORT ButtonComponent : public ComponentGroup, public LabelTarget, public Measurable {
DECLARE_ACE_TYPE(ButtonComponent, ComponentGroup, LabelTarget, Measurable);
@ -78,6 +81,25 @@ public:
void SetRadiusState(bool state);
void SetMinWidth(const Dimension& width);
void SetRectRadius(const Dimension& radius);
void SetHeightForState(const Dimension& height, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<ButtonStateAttribute, AnimatableDimension>>(
state, ButtonStateAttribute::HEIGHT, AnimatableDimension(height, option)));
}
void SetWidthForState(const Dimension& width, const AnimationOption& option, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<ButtonStateAttribute, AnimatableDimension>>(
state, ButtonStateAttribute::WIDTH, AnimatableDimension(width, option)));
}
void SetRectRadiusForState(const Dimension& radius, StyleState state)
{
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<ButtonStateAttribute, Dimension>>(
state, ButtonStateAttribute::RADIUS, radius));
};
void SetProgressDiameter(const Dimension& diameter);
void SetBackgroundColor(const Color& color);
void SetClickedColor(const Color& color);
@ -87,6 +109,13 @@ public:
void SetProgressColor(const Color& color);
void SetProgressFocusColor(const Color& color);
void SetFocusAnimationColor(const Color& color);
void SetColorForState(const Color& color, StyleState state)
{
GetStateAttributeList()->push_back(
MakeRefPtr<StateAttributeValue<ButtonStateAttribute, Color>>(state, ButtonStateAttribute::COLOR, color));
}
void SetBorderEdge(const BorderEdge& borderEdge);
void SetClickedEventId(const EventMarker& eventId);
void SetClickFunction(std::function<void()>&& clickCallback);
@ -164,6 +193,19 @@ public:
uint32_t Compare(const RefPtr<Component>& component) const override;
RefPtr<StateAttributeList<ButtonStateAttribute>> GetStateAttributeList()
{
if (stateAttributeList_ == nullptr) {
stateAttributeList_ = MakeRefPtr<StateAttributeList<ButtonStateAttribute>>();
}
return stateAttributeList_;
}
bool HasStateAttributeList()
{
return stateAttributeList_ != nullptr;
}
private:
RefPtr<ButtonDeclaration> declaration_;
ButtonType type_ { ButtonType::NORMAL };
@ -175,6 +217,7 @@ private:
uint32_t layoutFlag_ = 0;
// for custom button type
std::array<Radius, 4> radii_ = { Radius(0.0_vp), Radius(0.0_vp), Radius(0.0_vp), Radius(0.0_vp) };
RefPtr<StateAttributeList<ButtonStateAttribute>> stateAttributeList_;
};
class ButtonBuilder {

View File

@ -17,6 +17,7 @@
#include "base/log/event_report.h"
#include "base/log/log.h"
#include "base/memory/ace_type.h"
#include "core/accessibility/accessibility_node.h"
#include "core/animation/keyframe_animation.h"
#include "core/common/frontend.h"
@ -171,7 +172,14 @@ void RenderButton::HandleTouchEvent(bool isTouch)
{
isClicked_ = isTouch;
if (isClicked_) {
#ifdef USE_STATE_STYLE_UPDATER
OnStatusStyleChanged(StyleState::PRESSED);
#endif
isMoveEventValid_ = true;
} else {
#ifdef USE_STATE_STYLE_UPDATER
OnStatusStyleChanged(StyleState::NORMAL);
#endif
}
if (isMoveEventValid_ || isWatch_) {
PlayTouchAnimation();
@ -192,6 +200,9 @@ void RenderButton::HandleMoveEvent(const TouchEventInfo& info)
if ((moveDeltaX < 0 || moveDeltaX > buttonSize_.Width()) || (moveDeltaY < 0 || moveDeltaY > buttonSize_.Height())) {
isClicked_ = false;
MarkNeedRender();
#ifdef USE_STATE_STYLE_UPDATER
OnStatusStyleChanged(StyleState::NORMAL);
#endif
isMoveEventValid_ = false;
}
}
@ -392,6 +403,10 @@ void RenderButton::Update(const RefPtr<Component>& component)
clickRecognizer_->SetUseCatchMode(catchMode);
SetAccessibilityText(button->GetAccessibilityText());
UpdateDownloadStyles(button);
#ifdef USE_STATE_STYLE_UPDATER
OnStatusStyleChanged(disabled_ ? StyleState::DISABLED : StyleState::NORMAL);
#endif
MarkNeedLayout();
}
@ -737,4 +752,67 @@ void RenderButton::PlayFocusAnimation(bool isFocus)
}
}
#ifdef USE_STATE_STYLE_UPDATER
void RenderButton::OnStatusStyleChanged(StyleState state)
{
RenderNode::OnStatusStyleChanged(state);
if (buttonComponent_ == nullptr || !buttonComponent_->HasStateAttributeList()) {
return;
}
bool color_defined = false;
bool default_color_defined = false;
bool border_radius_defined = false;
bool default_border_radius_defined = false;
bool updated = false;
for (auto attribute : *buttonComponent_->GetStateAttributeList()) {
if (attribute->stateName_ != state) {
continue;
}
updated = true;
switch (attribute->id_) {
case ButtonStateAttribute::COLOR: {
color_defined = true;
default_color_defined = default_color_defined || attribute->stateName_ == StyleState::NORMAL;
auto colorState = AceType::DynamicCast<StateAttributeValue<ButtonStateAttribute, Color>>(attribute);
if (attribute->stateName_ == StyleState::PRESSED) {
SetClickedColor(colorState->value_);
}
if (attribute->stateName_ == StyleState::NORMAL) {
buttonComponent_->SetBackgroundColor(colorState->value_);
}
} break;
case ButtonStateAttribute::RADIUS: {
border_radius_defined = true;
default_border_radius_defined =
default_border_radius_defined || attribute->stateName_ == StyleState::NORMAL;
auto radiusState =
AceType::DynamicCast<StateAttributeValue<ButtonStateAttribute, Dimension>>(attribute);
buttonComponent_->SetRectRadius(radiusState->value_);
} break;
case ButtonStateAttribute::HEIGHT: {
auto valueState =
AceType::DynamicCast<StateAttributeValue<ButtonStateAttribute, AnimatableDimension>>(attribute);
buttonComponent_->SetHeight(valueState->value_);
height_ = valueState->value_;
} break;
case ButtonStateAttribute::WIDTH: {
auto valueState =
AceType::DynamicCast<StateAttributeValue<ButtonStateAttribute, AnimatableDimension>>(attribute);
buttonComponent_->SetWidth(valueState->value_);
width_ = valueState->value_;
} break;
}
if (updated) {
MarkNeedLayout();
}
}
}
#endif
} // namespace OHOS::Ace

View File

@ -47,6 +47,9 @@ public:
void Update(const RefPtr<Component>& component) override;
void PerformLayout() override;
void OnPaintFinish() override;
#ifdef USE_STATE_STYLE_UPDATER
virtual void OnStatusStyleChanged(StyleState state) override;
#endif
void OnAttachContext() override
{
@ -199,7 +202,6 @@ private:
AnimatableDimension width_;
AnimatableDimension height_;
Dimension radius_;
Dimension minWidth_;
bool valueChanged_ = false;
bool isClickAnimation_ = false;

View File

@ -0,0 +1,59 @@
/*
* Copyright (c) 2021 Huawei Device Co., Ltd.
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
#ifndef FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_COMMON_STATE_ATTRUBUTES_H
#define FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_COMMON_STATE_ATTRUBUTES_H
#include <list>
#include "base/memory/ace_type.h"
namespace OHOS::Ace {
enum class StyleState {
NORMAL = 0,
PRESSED,
DISABLED
};
// Classes below (StateAttributeList) owned by Components
// and passed to RenderNodes for execution
template<class AttributeID>
class StateAttributeBase : public virtual AceType {
DECLARE_ACE_TYPE(StateAttributeBase<AttributeID>, AceType);
public:
StateAttributeBase(StyleState state, AttributeID id) : stateName_(state), id_(id) {}
~StateAttributeBase() override = default;
StyleState stateName_;
const AttributeID id_;
};
template<class AttributeID, class Attribute>
class StateAttributeValue : public StateAttributeBase<AttributeID> {
DECLARE_ACE_TYPE(StateAttributeValue, StateAttributeBase<AttributeID>);
public:
StateAttributeValue(StyleState state, AttributeID id, Attribute value)
: StateAttributeBase<AttributeID>(state, id), value_(value)
{}
~StateAttributeValue() override = default;
Attribute value_;
};
template<class AttributeID>
class StateAttributeList : public Referenced, public std::list<RefPtr<StateAttributeBase<AttributeID>>> {};
} // namespace OHOS::Ace
#endif // FOUNDATION_ACE_FRAMEWORKS_CORE_COMPONENTS_COMMON_STATE_ATTRUBUTES_H

View File

@ -23,6 +23,10 @@
namespace OHOS::Ace {
enum class DisplayStateAttribute {
OPACITY,
};
enum class VisibleType {
VISIBLE,
INVISIBLE,
@ -64,9 +68,12 @@ public:
visible_ = visible;
}
void SetOpacity(double opacity, const AnimationOption& animationOption = AnimationOption())
void SetOpacity(double opacity, const AnimationOption& animationOption = AnimationOption(),
StyleState state = StyleState::NORMAL)
{
opacity_ = AnimatableDouble(opacity, animationOption);
GetStateAttributeList()->push_back(MakeRefPtr<StateAttributeValue<DisplayStateAttribute, AnimatableDouble>>(
state, DisplayStateAttribute::OPACITY, opacity_));
}
void DisableLayer(bool disable)
@ -136,6 +143,19 @@ public:
return duration_;
}
RefPtr<StateAttributeList<DisplayStateAttribute>> GetStateAttributeList()
{
if (stateAttributeList_ == nullptr) {
stateAttributeList_ = MakeRefPtr<StateAttributeList<DisplayStateAttribute>>();
}
return stateAttributeList_;
}
bool HasStateAttributeList()
{
return stateAttributeList_ != nullptr;
}
private:
VisibleType visible_ = VisibleType::VISIBLE;
Shadow shadow_;
@ -146,6 +166,7 @@ private:
bool hasAppearTransition_ = false;
bool disableLayer_ = false;
int32_t duration_ = 0;
RefPtr<StateAttributeList<DisplayStateAttribute>> stateAttributeList_ = nullptr;
};
} // namespace OHOS::Ace

View File

@ -61,6 +61,12 @@ void RenderDisplay::Update(const RefPtr<Component>& component)
animator_->Play();
}
#ifdef USE_STATE_STYLE_UPDATER
if (display->HasStateAttributeList()) {
stateAttributeList_ = display->GetStateAttributeList();
}
OnStatusStyleChanged(StyleState::NORMAL);
#endif
SetShadow(display->GetShadow());
MarkNeedLayout();
}
@ -104,8 +110,10 @@ void RenderDisplay::GetOpacityCallbacks()
void RenderDisplay::Dump()
{
if (DumpLog::GetInstance().GetDumpFile()) {
DumpLog::GetInstance().AddDesc(std::string("Display: ").append(visible_ == VisibleType::VISIBLE ? "visible" :
visible_ == VisibleType::INVISIBLE ? "invisible" : "gone"));
DumpLog::GetInstance().AddDesc(
std::string("Display: ")
.append(visible_ == VisibleType::VISIBLE ? "visible"
: visible_ == VisibleType::INVISIBLE ? "invisible" : "gone"));
DumpLog::GetInstance().AddDesc(std::string("Opacity: ").append(std::to_string(animatableOpacity_.GetValue())));
}
}
@ -204,4 +212,34 @@ void RenderDisplay::CreateAppearingAnimation(uint8_t opacity, int32_t limit)
animator_->SetDuration(std::min(duration_, limit));
}
void RenderDisplay::OnStatusStyleChanged(StyleState componentState)
{
RenderNode::OnStatusStyleChanged(componentState);
if (stateAttributeList_ == nullptr) {
return;
}
bool updated = false;
for (RefPtr<StateAttributeBase<DisplayStateAttribute>> attribute : *stateAttributeList_) {
if (attribute->stateName_ != componentState) {
continue;
}
updated = true;
switch (attribute->id_) {
case DisplayStateAttribute::OPACITY: {
auto opacityState =
AceType::DynamicCast<StateAttributeValue<DisplayStateAttribute, AnimatableDouble>>(attribute);
if (!pendingAppearing_) {
animatableOpacity_ = opacityState->value_;
}
opacity_ = static_cast<uint8_t>(round(animatableOpacity_.GetValue() * UINT8_MAX));
} break;
}
}
if (updated) {
MarkNeedLayout();
}
}
} // namespace OHOS::Ace

View File

@ -91,6 +91,8 @@ public:
bool GetVisible() const override;
void OnStatusStyleChanged(StyleState state) override;
void OnTransition(TransitionType type, int32_t id) override;
bool HasDisappearingTransition(int32_t nodeId) override;
@ -117,6 +119,9 @@ protected:
WeakPtr<DisplayComponent> displayComponent_;
RefPtr<CurveAnimation<uint8_t>> appearingAnimation_;
RefPtr<Animator> animator_;
#ifdef USE_STATE_STYLE_UPDATER
RefPtr<StateAttributeList<DisplayStateAttribute>> stateAttributeList_;
#endif
};
} // namespace OHOS::Ace

View File

@ -32,6 +32,18 @@ inline constexpr int32_t INDEX_THREE = 3;
inline constexpr float PERSPECTIVE = 0.0005f;
inline constexpr Dimension HALF_PERCENT = 0.5_pct;
enum class TransformStateAttribute {
ROTATE,
ROTATEX,
ROTATEY,
SCALE,
SCALEX,
SCALEY,
TRANSLATE,
TRANSLATEX,
TRANSLATEY,
};
class ACE_EXPORT TransformComponent : public SoleChildComponent {
DECLARE_ACE_TYPE(TransformComponent, SoleChildComponent)
@ -155,6 +167,20 @@ public:
void SetTranslateTransition(TransitionType type, const Dimension& x, const Dimension& y, const Dimension& z);
void SetRotateTransition(TransitionType type, double x, double y, double z, double angle);
RefPtr<StateAttributeList<TransformStateAttribute>> GetStateAttributeList()
{
if (stateAttributeList_ == nullptr) {
stateAttributeList_ = MakeRefPtr<StateAttributeList<TransformStateAttribute>>();
}
return stateAttributeList_;
}
bool HasStateAttributeList()
{
return stateAttributeList_ != nullptr;
}
private:
Matrix4 transform_;
AnimatableTransformOperations transformEffects;
@ -166,6 +192,7 @@ private:
ClickSpringEffectType clickSpringEffectType_ = ClickSpringEffectType::NONE;
TransitionEffect transitionEffect_ = TransitionEffect::NONE;
Shadow shadow_;
RefPtr<StateAttributeList<TransformStateAttribute>> stateAttributeList_ = nullptr;
};
} // namespace OHOS::Ace

View File

@ -42,9 +42,7 @@ void RenderElement::Prepare(const WeakPtr<Element>& parent)
renderNode_ = CreateRenderNode();
}
if (renderNode_) {
if (SystemProperties::GetRosenBackendEnabled()) {
renderNode_->SyncRSNodeBoundary(component_->IsHeadComponent(), component_->IsTailComponent());
}
renderNode_->SyncRSNodeBoundary(component_->IsHeadComponent(), component_->IsTailComponent());
SetAccessibilityNode(parent);
renderNode_->Attach(context_);
}

View File

@ -1813,9 +1813,9 @@ void RenderNode::SetDepth(int32_t depth)
void RenderNode::SyncRSNodeBoundary(bool isHead, bool isTail)
{
#ifdef ENABLE_ROSEN_BACKEND
isHeadRenderNode_ = isHead;
isTailRenderNode_ = isTail;
#ifdef ENABLE_ROSEN_BACKEND
if (isHead && !rsNode_) {
// create RSNode in first node of JSview
rsNode_ = CreateRSNode();
@ -1906,4 +1906,18 @@ std::shared_ptr<RSNode> RenderNode::CreateRSNode() const
#endif
}
#ifdef USE_STATE_STYLE_UPDATER
void RenderNode::OnStatusStyleChanged(StyleState state)
{
LOGD("start %{public}s", AceType::TypeName(this));
if (isHeadRenderNode_) {
return;
}
RefPtr<RenderNode> parent = parent_.Upgrade();
if (parent) {
parent->OnStatusStyleChanged(state);
}
}
#endif
} // namespace OHOS::Ace

View File

@ -32,6 +32,7 @@
#include "core/components/common/layout/constants.h"
#include "core/components/common/layout/layout_param.h"
#include "core/components/common/properties/motion_path_option.h"
#include "core/components/common/properties/state_attributes.h"
#include "core/components/common/properties/text_style.h"
#include "core/components_v2/extensions/events/event_extensions.h"
#include "core/components_v2/inspector/inspector_node.h"
@ -570,6 +571,8 @@ public:
}
}
virtual void OnStatusStyleChanged(StyleState state);
Offset GetOffsetFromOrigin(const Offset& offset) const;
virtual Offset GetGlobalOffset() const;