修复材质编辑模式无输出内容的问题
This commit is contained in:
parent
65a3779e1a
commit
59703decc4
@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "material-editor",
|
"name": "material-editor",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "1.0.14",
|
"version": "1.0.15",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vite",
|
"dev": "vite",
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
<label>上传路径ID</label>
|
<label>上传路径ID</label>
|
||||||
<input v-model="materialInfo.dirId" type="text" placeholder="材质路径ID" />
|
<input v-model="materialInfo.dirId" type="text" placeholder="材质路径ID" />
|
||||||
<label>配置JSON</label>
|
<label>配置JSON</label>
|
||||||
<input v-model="materialInfo.inputText" type="text" />
|
<input v-model="materialInfo.inputText" type="text" />
|
||||||
<button class="btn-success" style="min-width: 110px;" @click="loadData">加载</button>
|
<button class="btn-success" style="min-width: 110px;" @click="loadData">加载</button>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<label>材质名</label>
|
<label>材质名</label>
|
||||||
@ -130,10 +130,12 @@ const scene = useScene();
|
|||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
name?: string;
|
name?: string;
|
||||||
textureSrcList?: string[];
|
textureSrcList?: string[];
|
||||||
|
/** 忽略纹理参数,提交时直接输出场景内的材质,用于某些在组件外对场景进行编辑的特殊情况(例如材质编辑模式) */
|
||||||
|
ignoreTexture?: boolean;
|
||||||
}>();
|
}>();
|
||||||
const emits = defineEmits<{
|
const emits = defineEmits<{
|
||||||
(e: 'cancel'): void;
|
(e: 'cancel'): void;
|
||||||
(e: 'submit', data: MaterialRequest[]): void;
|
(e: 'submit', data: MaterialRequest[]): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const Material = computed(() => scene.Material);
|
const Material = computed(() => scene.Material);
|
||||||
@ -161,8 +163,8 @@ const uploading = ref(false);
|
|||||||
// });
|
// });
|
||||||
const materialInfo = reactive({
|
const materialInfo = reactive({
|
||||||
dirId: DirectoryId.MaterialDir, // 正常来说是2
|
dirId: DirectoryId.MaterialDir, // 正常来说是2
|
||||||
materialName: props.name || '材质',
|
materialName: props.name || '材质',
|
||||||
inputText:'',
|
inputText: '',
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(() => props.textureSrcList, async (val) => {
|
watch(() => props.textureSrcList, async (val) => {
|
||||||
@ -182,7 +184,7 @@ watch(() => scene.CurrTexture, (val) => {
|
|||||||
rotation: val.rotation,
|
rotation: val.rotation,
|
||||||
repeatX: val.repeat.x,
|
repeatX: val.repeat.x,
|
||||||
repeatY: val.repeat.y,
|
repeatY: val.repeat.y,
|
||||||
moveX: val.offset.x,
|
moveX: val.offset.x,
|
||||||
moveY: val.offset.y
|
moveY: val.offset.y
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -218,7 +220,7 @@ function UpdateTexture() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function loadData() {
|
async function loadData() {
|
||||||
if(!materialInfo.inputText) return;
|
if (!materialInfo.inputText) return;
|
||||||
const json = JSON.parse(materialInfo.inputText);
|
const json = JSON.parse(materialInfo.inputText);
|
||||||
const cadFile = FromDeflateBase64(json.file);
|
const cadFile = FromDeflateBase64(json.file);
|
||||||
scene.ImportMaterialAsync(cadFile)
|
scene.ImportMaterialAsync(cadFile)
|
||||||
@ -233,18 +235,31 @@ async function HandleUpload() {
|
|||||||
|
|
||||||
uploading.value = true;
|
uploading.value = true;
|
||||||
const result = [];
|
const result = [];
|
||||||
// 遍历纹理链接列表,更改纹理后将材质序列化,然后还原场景
|
if (props.ignoreTexture) {
|
||||||
let idx = 0;
|
// 直接将材质序列化
|
||||||
for (const src of props.textureSrcList) {
|
|
||||||
await scene.ChangeTextureFromUrlAsync(src);
|
|
||||||
const mat = {
|
const mat = {
|
||||||
name: materialInfo.materialName + ++idx,
|
name: materialInfo.materialName,
|
||||||
logo: await scene.GenerateMaterialLogoAsync(),
|
logo: await scene.GenerateMaterialLogoAsync(),
|
||||||
// jsonString -> Deflate -> BinaryString -> Base64
|
// jsonString -> Deflate -> BinaryString -> Base64
|
||||||
file: ToDeflatedBase64(await scene.SerializeMaterialAsync())
|
file: ToDeflatedBase64(await scene.SerializeMaterialAsync())
|
||||||
};
|
};
|
||||||
result.push(mat);
|
result.push(mat);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// 遍历纹理链接列表,更改纹理后将材质序列化,然后还原场景
|
||||||
|
let idx = 0;
|
||||||
|
for (const src of _textureSrc.value) {
|
||||||
|
await scene.ChangeTextureFromUrlAsync(src);
|
||||||
|
const mat = {
|
||||||
|
name: materialInfo.materialName + ++idx,
|
||||||
|
logo: await scene.GenerateMaterialLogoAsync(),
|
||||||
|
// jsonString -> Deflate -> BinaryString -> Base64
|
||||||
|
file: ToDeflatedBase64(await scene.SerializeMaterialAsync())
|
||||||
|
};
|
||||||
|
result.push(mat);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
await scene.ChangeTextureFromUrlAsync(_textureSrc.value[0]);
|
await scene.ChangeTextureFromUrlAsync(_textureSrc.value[0]);
|
||||||
emits('submit', result);
|
emits('submit', result);
|
||||||
return result;
|
return result;
|
||||||
|
@ -1,7 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<CfFlex class="material-view">
|
<CfFlex class="material-view">
|
||||||
<div ref="container" class="material-view-container" />
|
<div ref="container" class="material-view-container" />
|
||||||
<MaterialAdjuster ref="adjuster" class="material-view-sider" :name="matName" :textureSrcList="textureSrc" @cancel="config.cancelCallback" @submit="config.submitCallback" />
|
<MaterialAdjuster ref="adjuster" class="material-view-sider" :name="matName" :textureSrcList="textureSrc" :ignore-texture="editMode"
|
||||||
|
@cancel="config.cancelCallback" @submit="config.submitCallback" />
|
||||||
</CfFlex>
|
</CfFlex>
|
||||||
</template>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -20,9 +21,10 @@ const adjusterRef = useTemplateRef('adjuster');
|
|||||||
const config = GetConfig();
|
const config = GetConfig();
|
||||||
const textureSrc = ref<string[]>(Array.from(config.textureSrc));
|
const textureSrc = ref<string[]>(Array.from(config.textureSrc));
|
||||||
const matName = ref<string>();
|
const matName = ref<string>();
|
||||||
|
const editMode = ref(false);
|
||||||
|
|
||||||
// 禁用右键菜单
|
// 禁用右键菜单
|
||||||
document.addEventListener('contextmenu', (e) => e.preventDefault());
|
document.addEventListener('contextmenu', (e) => e.preventDefault());
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
scene.Initial(container.value);
|
scene.Initial(container.value);
|
||||||
await HandleUpdateConfig();
|
await HandleUpdateConfig();
|
||||||
@ -51,16 +53,19 @@ async function HandleUpdateConfig() {
|
|||||||
matName.value = config.updateModel.name;
|
matName.value = config.updateModel.name;
|
||||||
const json = FromDeflateBase64(config.updateModel.file);
|
const json = FromDeflateBase64(config.updateModel.file);
|
||||||
await scene.ImportMaterialAsync(json);
|
await scene.ImportMaterialAsync(json);
|
||||||
|
editMode.value = true;
|
||||||
|
}
|
||||||
|
else { editMode.value = false; }
|
||||||
|
if (config.textureSrc) {
|
||||||
|
textureSrc.value = Array.from(config.textureSrc);
|
||||||
|
await scene.ChangeTextureFromUrlAsync(textureSrc.value[0]);
|
||||||
}
|
}
|
||||||
textureSrc.value = Array.from(config.textureSrc);
|
|
||||||
await scene.ChangeTextureFromUrlAsync(textureSrc.value[0]);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.material-view
|
.material-view {
|
||||||
{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@ -69,16 +74,16 @@ async function HandleUpdateConfig() {
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
&-container {
|
&-container {
|
||||||
flex: 3 1;
|
flex: 3 1;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
&-sider {
|
&-sider {
|
||||||
flex: 1 1;
|
flex: 1 1;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user