Skip to content

Commit

Permalink
feat: 增加LineHeight\LineSpacing\TextAlign\TextOverflow\FontWeight解析
Browse files Browse the repository at this point in the history
  • Loading branch information
heiazu committed Nov 10, 2023
1 parent a40fe13 commit 4ebf7b5
Show file tree
Hide file tree
Showing 11 changed files with 409 additions and 44 deletions.
7 changes: 7 additions & 0 deletions __test__/fixure/Mod.scss
Original file line number Diff line number Diff line change
Expand Up @@ -206,4 +206,11 @@
border-top-color: #00f;

border-top-style: dashed;

line-height: 1;
text-align: center;

text-decoration: line-through;

font-weight: lighter;
}
41 changes: 0 additions & 41 deletions __test__/fixure/mod.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -84,44 +84,3 @@ export default class Mod extends React.Component {
)
}
}

// function Mod() {
// return (
// <div className='mod' style={{ width: '500px', height: 800 }}>
// <div className='cnt_row'>
// <img
// className='icon'
// src='//img20.360buyimg.com/img/jfs/t1/166410/12/38783/3147/64f58062Fd7737e2b/5aaf0205cd1ce175.png'
// ></img>
// <span className='line1 instruction'>超能芭比 5分钟前查看团购</span>
// </div>
// <div className='cnt_row1'>
// <img
// className='img'
// src='//img12.360buyimg.com/img/jfs/t1/100881/15/44805/18567/64f58062F1b45e0cb/caf065a7410087ce.png'
// ></img>
// <div className='cnt_col'>
// <span className='line1 instruction1'>巴拉巴拉小魔仙</span>
// <span className='line1 txt'>成员: 4000+</span>
// </div>
// <div className='cnt_row2'>
// <img
// className='icon1'
// src='//img11.360buyimg.com/img/jfs/t1/175578/35/40256/1981/64f58062Fddaf1a21/f1111d9988a65ccc.png'
// ></img>
// <span className='instruction2'>slslsl-jsj</span>
// <span className='txt1'>复制</span>
// </div>
// </div>
// <div className='cnt_row3'>
// <span className='line2 txt2'>
// 团长介绍:售前售后进群售前售后进群售前售后进群售前售后进群VXklsidohh...
// </span>
// <img
// className='img1'
// src='//img14.360buyimg.com/img/jfs/t1/206378/24/25778/195/64eca527F378f17a2/c1623681708609fd.png'
// ></img>
// </div>
// </div>
// )
// }
39 changes: 37 additions & 2 deletions src/style_parser.rs
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ use crate::{
margin_padding::MarginPadding,
style_value_type::StyleValueType,
text_decoration::TextDecoration,
transform::transform::Transform, constraint_size::ConstraintSize, border::{border_width::BorderWidth, border_color::BorderColor, border_radius::BorderRadius, border_style::BorderStyle},
transform::transform::Transform, constraint_size::ConstraintSize, border::{border_width::BorderWidth, border_color::BorderColor, border_radius::BorderRadius, border_style::BorderStyle}, text::{line_height::LineHeight, letter_spacing::LetterSpacing, text_align::TextAlign, text_overflow::TextOverflow, font_weight::FontWeight},
},
utils::{
to_camel_case,
Expand Down Expand Up @@ -281,6 +281,41 @@ pub fn parse_style_properties(properties: &Vec<(String, Property<'_>)>) -> Style
}
}
}
"lineHeight" => {
let line_height = LineHeight::from(value);
final_properties.insert(
prefix_style_key("lineHeight"),
StyleValueType::LineHeight(line_height),
);
}
"letter-spacing" => {
let letter_spacing = LetterSpacing::from(value);
final_properties.insert(
prefix_style_key("letterSpacing"),
StyleValueType::LetterSpacing(letter_spacing),
);
}
"textAlign" => {
let text_align = TextAlign::from(value);
final_properties.insert(
prefix_style_key("textAlign"),
StyleValueType::TextAlign(text_align),
);
}
"textOverflow" => {
let text_overflow = TextOverflow::from(value);
final_properties.insert(
prefix_style_key("textOverflow"),
StyleValueType::TextOverflow(text_overflow),
);
}
"fontWeight" => {
let font_weight = FontWeight::from(value);
final_properties.insert(
prefix_style_key("fontWeight"),
StyleValueType::FontWeight(font_weight),
);
}
"textDecoration" => {
text_decoration = Some(value);
}
Expand Down Expand Up @@ -534,7 +569,7 @@ pub fn parse_style_properties(properties: &Vec<(String, Property<'_>)>) -> Style
if let Some(text_decoration) = text_decoration {
let text_decoration = TextDecoration::from((text_decoration, color));
final_properties.insert(
prefix_style_key("textDecoration"),
prefix_style_key("decoration"),
StyleValueType::TextDecoration(text_decoration),
);
}
Expand Down
1 change: 1 addition & 0 deletions src/style_transform/mod.rs
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ pub mod background;
pub mod flex_options;
pub mod flex_size;
pub mod border;
pub mod text;
mod macros;
pub mod margin_padding;
pub mod constraint_size;
Expand Down
13 changes: 12 additions & 1 deletion src/style_transform/style_value_type.rs
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ use super::{
text_decoration::TextDecoration,
traits::ToExpr,
transform::{Matrices, Rotates, Scales, Translates},
text::{line_height::LineHeight, letter_spacing::LetterSpacing, text_align::TextAlign, text_overflow::TextOverflow, font_weight::FontWeight},
};

#[derive(Debug, Clone)]
Expand All @@ -34,6 +35,11 @@ pub enum StyleValueType {
BorderColor(BorderColor),
BorderWidth(BorderWidth),
BorderStyle(BorderStyle),
LineHeight(LineHeight),
LetterSpacing(LetterSpacing),
TextAlign(TextAlign),
TextOverflow(TextOverflow),
FontWeight(FontWeight)
}

impl ToExpr for StyleValueType {
Expand All @@ -58,7 +64,12 @@ impl ToExpr for StyleValueType {
StyleValueType::ConstraintSize(constraint_size) => constraint_size.to_expr().into(),
StyleValueType::BorderColor(border_color) => border_color.to_expr().into(),
StyleValueType::BorderWidth(border_width) => border_width.to_expr().into(),
StyleValueType::BorderStyle(border_style) => border_style.to_expr().into()
StyleValueType::BorderStyle(border_style) => border_style.to_expr().into(),
StyleValueType::LineHeight(line_height) => line_height.to_expr().into(),
StyleValueType::LetterSpacing(letter_spacing) => letter_spacing.to_expr().into(),
StyleValueType::TextAlign(text_align) => text_align.to_expr().into(),
StyleValueType::TextOverflow(text_overflow) => text_overflow.to_expr().into(),
StyleValueType::FontWeight(font_weight) => font_weight.to_expr().into(),
}
}
}
78 changes: 78 additions & 0 deletions src/style_transform/text/font_weight.rs
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
use lightningcss::properties::{Property, font};
use swc_common::DUMMY_SP;
use swc_ecma_ast::{Expr, Lit, Number, Ident, MemberProp, MemberExpr};

use crate::style_transform::traits::ToExpr;

#[derive(Debug, Clone)]
pub enum FontWeight {
Number(f32),
Bold,
Bolder,
Lighter,
Normal
}

impl ToExpr for FontWeight {
fn to_expr(&self) -> Expr {
let font_weight: Expr;
match self {
FontWeight::Number(num) => {
font_weight = Expr::Lit(Lit::Num(Number::from(*num as f64)));
}
FontWeight::Bold | FontWeight::Bolder | FontWeight::Lighter | FontWeight::Normal => {
font_weight = Expr::Member(MemberExpr {
span: DUMMY_SP,
obj: Box::new(Expr::Ident(Ident::new("FontWeight".into(), DUMMY_SP))),
prop: MemberProp::Ident(Ident {
span: DUMMY_SP,
sym: match self {
FontWeight::Bold => "Bold",
FontWeight::Bolder => "Bolder",
FontWeight::Lighter => "Lighter",
FontWeight::Normal => "Normal",
FontWeight::Number(_) => "",
}
.into(),
optional: false,
}),
})
.into()
},
}
font_weight
}
}

impl From<&Property<'_>> for FontWeight {
fn from(value: &Property<'_>) -> Self {
let mut font_weight = FontWeight::Normal;
match value {
Property::FontWeight(value) => {
match value {
font::FontWeight::Bolder => {
font_weight = FontWeight::Bolder
},
font::FontWeight::Lighter => {
font_weight = FontWeight::Lighter
},
font::FontWeight::Absolute(val) => {
match val {
font::AbsoluteFontWeight::Bold => {
font_weight = FontWeight::Bold
},
font::AbsoluteFontWeight::Weight(num) => {
font_weight = FontWeight::Number(*num)
},
font::AbsoluteFontWeight::Normal => {
font_weight = FontWeight::Normal
},
}
},
}
}
_ => {}
}
font_weight
}
}
79 changes: 79 additions & 0 deletions src/style_transform/text/letter_spacing.rs
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
use lightningcss::{
properties::{Property,text::Spacing},
values
};
use swc_common::DUMMY_SP;
use swc_ecma_ast::{Expr, Lit, Number, Callee, Ident, CallExpr};

use crate::style_transform::traits::ToExpr;

#[derive(Debug, Clone)]
pub enum LetterSpacing {
Px(f32),
Number(f32)
}

impl ToExpr for LetterSpacing {
fn to_expr(&self) -> Expr {
let mut letter_spacing = Expr::Lit(Lit::Null(swc_ecma_ast::Null { span: DUMMY_SP }));
match self {
LetterSpacing::Number(_) => {
// 暂不支持数值类型
// Expr::Call(CallExpr {
// span: DUMMY_SP,
// callee: Callee::Expr(Box::new(Expr::Ident(Ident::new(
// "convertLetterSpacing".into(),
// DUMMY_SP,
// )))),
// args: vec![
// Expr::Lit(Lit::Num(Number::from(*value as f64))).into()
// ],
// type_args: None,
// })
},
LetterSpacing::Px(value) => {
letter_spacing = Expr::Call(CallExpr {
span: DUMMY_SP,
callee: Callee::Expr(Box::new(Expr::Ident(Ident::new(
"convertPx".into(),
DUMMY_SP,
)))),
args: vec![
Expr::Lit(Lit::Num(Number::from(*value as f64))).into()
],
type_args: None,
})
}
}
letter_spacing
}
}

impl From<&Property<'_>> for LetterSpacing {
fn from(value: &Property<'_>) -> Self {
let mut letter_spacing = LetterSpacing::Number(1.0);
match value {
Property::LetterSpacing(value) => {
match value {
Spacing::Length(val) => {
match val {
values::length::Length::Value(value) => {
match value {
values::length::LengthValue::Px(value) => {
// 匹配px单位
letter_spacing = LetterSpacing::Px(*value)
},
_ => {}
}
},
_ => {}
}
}
Spacing::Normal => {},
}
}
_ => {}
}
letter_spacing
}
}
Loading

0 comments on commit 4ebf7b5

Please sign in to comment.