Question

我正在尝试根据Device（我的代码）设置自定义TabBar的高度：

<head>
    <script 
        src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
        src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous">
    </script>
</head>
<body>
<script>
    $.ajax({
              url:"bdayupget.php",
              cache:false,
              type:"GET",
              dataType:"text",
              data:{},
              success:(function(dat){alert('data is '+dat);
                       }),
              error: err=>{
                console.log(err)
              }
                       
           })
    //now the url:bdayupget.php
    <?php echo "tea time"; ?>
</script>

如果设备有缺口，如何将自定义TabBar设置为更高的高度？ SwiftUI在这里有用吗？

Answer 1

您可以使用GeometryReader元素来访问安全区域插图，并使用.safeAreaInsets.bottom将其添加为填充（请注意，Xcode自动补全几乎对GeometryProxy属性无效）：

var body: some View {
    GeometryReader { proxy in
        VStack {
            // Content goes here
            Spacer()

            // Custom tab bar
            HStack {
                Spacer()
                Button(action: {}) {
                    Image(systemName: "house.fill")
                    .padding()
                }
                Spacer()
                Button(action: {}) {
                    Image(systemName: "house.fill")
                    .padding()
                }
                Spacer()
                Button(action: {}) {
                    Image(systemName: "house.fill")
                    .padding()
                }
                Spacer()
                Button(action: {}) {
                    Image(systemName: "house.fill")
                    .padding()
                }
                Spacer()
            }
            .padding(.bottom, proxy.safeAreaInsets.bottom)
            .background(Color.red)

        }
    }.edgesIgnoringSafeArea(.bottom)
}

SwiftUI-基于设备的自定义TabBar高度

1 个答案: