样式优化
This commit is contained in:
parent
42059e3c6f
commit
2fc1301cb9
|
|
@ -100,7 +100,9 @@
|
|||
}
|
||||
}
|
||||
|
||||
>div:nth-child(3) {
|
||||
>div:nth-child(3) {}
|
||||
|
||||
.beautyEffect {
|
||||
>span {
|
||||
color: white;
|
||||
}
|
||||
|
|
@ -144,7 +146,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
>div:nth-child(4) {
|
||||
.otherVideoSeeting {
|
||||
>div {
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
|
|
|||
|
|
@ -147,6 +147,7 @@ const VideoComponents = () => {
|
|||
list: [],
|
||||
item: null,
|
||||
});
|
||||
const [videoKey, setVideoKey] = useState('beautyEffect');
|
||||
const [virtualBackgroundImg] = useState([
|
||||
ImageUrl.virtualBackground1,
|
||||
ImageUrl.virtualBackground2,
|
||||
|
|
@ -213,7 +214,7 @@ const VideoComponents = () => {
|
|||
if (setting.virtualBackground) {
|
||||
setVirtualBackground(setting.virtualBackground)
|
||||
} else {
|
||||
setting.darkLightEnhancement = {
|
||||
setting.virtualBackground = {
|
||||
isVirtualBackground: false, //是否打开虚拟背景
|
||||
color: '0xFFFFFF', // 纯色
|
||||
sourceIndex: '', // 背景图下标
|
||||
|
|
@ -338,6 +339,16 @@ const VideoComponents = () => {
|
|||
|
||||
</div>
|
||||
<div>
|
||||
<Radio.Group buttonStyle="solid" value={videoKey} onChange={(e) => {
|
||||
setVideoKey(e.target.value)
|
||||
}}>
|
||||
<Radio.Button value="beautyEffect">虚拟背景</Radio.Button>
|
||||
<Radio.Button value="colorEnhancement">美颜效果</Radio.Button>
|
||||
<Radio.Button value="darkLightEnhancement">色彩增强</Radio.Button>
|
||||
<Radio.Button value="virtualBackground">暗光增强</Radio.Button>
|
||||
</Radio.Group>
|
||||
</div>
|
||||
{videoKey === 'beautyEffect' ? <div className={styles.beautyEffect}>
|
||||
<span>
|
||||
<Checkbox style={{ marginRight: '10px' }} checked={virtualBackground.isVirtualBackground} onChange={(e) => {
|
||||
setting.virtualBackground.isVirtualBackground = e.target.checked;
|
||||
|
|
@ -389,9 +400,9 @@ const VideoComponents = () => {
|
|||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div>
|
||||
</div> : null}
|
||||
<div className={styles.otherVideoSeeting}>
|
||||
{videoKey === 'colorEnhancement' ? <div>
|
||||
<span>
|
||||
<Checkbox style={{ marginRight: '10px' }} checked={beautyEffect.isBeautyEffect} onChange={(e) => {
|
||||
setting.beautyEffect.isBeautyEffect = e.target.checked;
|
||||
|
|
@ -479,8 +490,8 @@ const VideoComponents = () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div> : null}
|
||||
{videoKey === 'darkLightEnhancement' ? <div>
|
||||
<span>
|
||||
<Checkbox style={{ marginRight: '10px' }} checked={colorEnhancement.isColorEnhancement} onChange={(e) => {
|
||||
setting.colorEnhancement.isColorEnhancement = e.target.checked;
|
||||
|
|
@ -523,8 +534,8 @@ const VideoComponents = () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
</div> : null}
|
||||
{videoKey === 'virtualBackground' ? <div>
|
||||
<span>
|
||||
<Checkbox style={{ marginRight: '10px' }} checked={darkLightEnhancement.isDarkLightEnhancement} onChange={(e) => {
|
||||
setting.darkLightEnhancement.isDarkLightEnhancement = e.target.checked;
|
||||
|
|
@ -571,7 +582,7 @@ const VideoComponents = () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> : null}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue