xiao/six_uniapp_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

six_uniapp_0005

Browse Source
This commit is contained in:
doudou201703
2026-08-21 23:47:28 +08:00
parent 205e074238
commit 830f6ca2a2
19 changed files with 755 additions and 805 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ChildComScroll.vue
+75 -20
View File
@@ -18,7 +18,6 @@
}
.status-bottom {
//background-color: green;
height: v-bind(statusTop高度差_rpx);
}
@@ -58,6 +57,7 @@
height: v-bind(statusHeight状态栏高度);
justify-content: center;
align-items: center;
line-height: v-bind(statusHeight状态栏高度);
.meun-widht-rightimage_item {
height: calc(v-bind(statusHeight状态栏高度) * 0.75);
@@ -67,6 +67,8 @@
}
.status-status-content {
font-size: 1rem;
line-height: v-bind(statusHeight状态栏高度);
height: v-bind(statusHeight状态栏高度);
display: flex;
justify-content: center;
@@ -118,7 +120,8 @@
modelValue: GlobelsChildPropsType;// 对象类型的 prop
statusHeight: string;
pxScreenHeight: string;
pxWindowHeight: string;//pxWindowHeight
pxWindowHeight: string;
info_scroll_height: number;
}
// 2. 使用 withDefaults 定义默认值
@@ -128,17 +131,23 @@
(eventName: "update:statusHeight", value: string): void
(eventName: "update:pxScreenHeight", value: string): void
(eventName: "update:pxWindowHeight", value: string): void
(eventName: "update:info_scroll_height", value: string): void
(eventName: "homeLeft",): void
(eventName: "homeRight",): void
}>();
const {modelValue, statusHeight, pxWindowHeight, pxScreenHeight} = useVModels(props, emit); // 这里是将整个全包在里面了
const {modelValue, statusHeight, pxWindowHeight, pxScreenHeight, info_scroll_height} = useVModels(props, emit); // 这里是将整个全包在里面了
const info_window = wx.getWindowInfo();
const pix = 750 / info_window.windowWidth;
const wifi_height高度 = computed(() => {
return wx.getWindowInfo().statusBarHeight * pix;
});
const pix = computed(() => 750 / wx.getWindowInfo().windowWidth);
const menuButton对象 = wx.getMenuButtonBoundingClientRect();
const statusTop高度差 = menuButton对象.top * pix - wifi_height高度.value;
const wifi_height高度 = computed(() => {
if (menuButton对象.top - info_window.statusBarHeight <= 0) {
return (info_window.statusBarHeight + (menuButton对象.top - info_window.statusBarHeight)) * pix.value;
} else {
return info_window.statusBarHeight * pix.value;
}
});
const statusTop高度差 = menuButton对象.top * pix.value - info_window.statusBarHeight * pix.value;
const wifi_height高度_rpx = computed(() => {
return wifi_height高度.value + "rpx";
});
@@ -153,9 +162,9 @@
const menu胶囊的高度 = computed(() => {
if (statusTop高度差 < 0) {
// return (menuButton对象.height * pix + statusTop高度差);
return (menuButton对象.height * pix + statusTop高度差 * 2);
return (menuButton对象.height * pix.value);
} else {
return (menuButton对象.height * pix);
return (menuButton对象.height * pix.value);
}
});
const statusHeight状态栏高度 = menu胶囊的高度.value + "rpx";
@@ -166,25 +175,71 @@
return wifi_height高度.value + menu胶囊的高度.value + statusTop高度差 * 2;
}
});
const window屏幕可用高度 = computed(() => {
if (info_window.screenHeight === info_window.windowHeight) {
return (info_window.screenHeight - (info_window.screenHeight - info_window.safeArea.bottom)) * pix.value;
} else {
return info_window.windowHeight * pix.value;
}
});
console.log("99999999999", info_window.screenHeight, info_window.safeArea.bottom);
const 整个高度_rpx = 整个高度.value + "rpx";
statusHeight.value = 整个高度_rpx;
if (modelValue.value.navIsShow === "none") {
info_scroll_height.value = Math.floor(window屏幕可用高度.value);
statusHeight.value = "0rpx";
}
if (modelValue.value.navIsShow === "default") {
info_scroll_height.value = Math.floor(window屏幕可用高度.value - 整个高度.value);
statusHeight.value = 整个高度_rpx;
}
const lef左侧的距离 = 750 - menuButton对象.right * pix + "rpx";
const menu胶囊宽度 = menuButton对象.width * pix + "rpx";
const content宽度 = 750 - (750 - menuButton对象.right * pix) * 2 - (menuButton对象.width * pix) * 2 + "rpx";
const window屏幕可用高度 = computed(() => {
if (info_window.screenHeight === info_window.windowHeight) {
return (info_window.screenHeight - (info_window.screenHeight - info_window.safeArea.bottom)) * pix;
} else {
return info_window.windowHeight * pix;
if (modelValue.value.navIsShow === "wifi") {
info_scroll_height.value = Math.floor(window屏幕可用高度.value - wifi_height高度.value);
statusHeight.value = wifi_height高度_rpx.value;
}
const lef左侧的距离 = 750 - menuButton对象.right * pix.value + "rpx";
const menu胶囊宽度 = menuButton对象.width * pix.value + "rpx";
const content宽度 = 750 - (750 - menuButton对象.right * pix.value) * 2 - (menuButton对象.width * pix.value) * 2 + "rpx";
pxScreenHeight.value = info_window.screenHeight * pix.value + "rpx";
pxWindowHeight.value = window屏幕可用高度.value + "rpx";
// 当阔折叠手机发生的时候需要重新计算当前的值
wx.onWindowResize((result) => {
const newInfo = wx.getWindowInfo();
const newPix = 750 / newInfo.windowWidth;
// 底部安全区域高度（px）
const bottomSafeHeight = newInfo.screenHeight - newInfo.safeArea.bottom;
// 内容可用高度（px），扣除底部安全区域
const contentHeight = result.size.windowHeight - bottomSafeHeight;
// 转成 rpx
pxWindowHeight.value = contentHeight * newPix + "rpx";
// 重新计算导航栏各段高度（全部用 newPix）
const newWifiHeight = newInfo.statusBarHeight * newPix;
const menuRect = wx.getMenuButtonBoundingClientRect();
const newMenuTop = menuRect.top * newPix;
const newMenuHeight = menuRect.height * newPix;
const newStatusTopGap = newMenuTop - newWifiHeight;
// 导航栏总高度
let navTotalHeight = newWifiHeight + newMenuHeight;
if (newStatusTopGap >= 0) {
navTotalHeight += newStatusTopGap * 2;
}
// 根据 navIsShow 更新内容区高度
if (modelValue.value.navIsShow === "default") {
info_scroll_height.value = Math.floor(contentHeight * newPix - navTotalHeight - 1);
statusHeight.value = navTotalHeight + "rpx";
} else if (modelValue.value.navIsShow === "none") {
info_scroll_height.value = Math.floor(contentHeight * newPix - 1);
statusHeight.value = "0rpx";
} else if (modelValue.value.navIsShow === "wifi") {
info_scroll_height.value = Math.floor(contentHeight * newPix - newWifiHeight - 1);
statusHeight.value = newWifiHeight + "rpx";
}
});
pxScreenHeight.value = info_window.screenHeight * pix + "rpx";
pxWindowHeight.value = window屏幕可用高度.value + "rpx";
</script>