【发布时间】：2020-10-22 14:57:19
【问题描述】：
我正在尝试在 Swift UI（Xcode 版本 11.5）中创建侧边菜单。菜单已创建并且似乎可以正常工作，但我面临的唯一问题是菜单文本未正确对齐（我需要将其左（前）对齐）。
主页视图 -
struct HomePageView: View {
@State var size = UIScreen.main.bounds.width / 1.6
var body: some View {
ZStack{
Color.orange
// main home page components here....
NavigationView{
List(0..<5){_ in
Text("Hello")
}
.navigationBarTitle("Home")
.navigationBarItems(leading: Button(action: {
self.size = 10
}, label: {
Image("menu")
.resizable()
.frame(width: 30, height: 30)
}).foregroundColor(.black))
}
HStack{
menu(size: $size)
.cornerRadius(20)
.padding(.leading, -size)
.offset(x: -size)
//.shadow(color: Color.lairShadowGray.opacity(0.5), radius: 0, x: 0, y: 0)
Spacer()
}
//.shadow(color: Color.lairShadowGray.opacity(0.5), radius: 0, x: 0, y: 0)
}.animation(.spring())
}
}
我尝试使用有效的状态变量动态创建菜单。对于菜单文本对齐，我尝试应用填充、框架、偏移但它不起作用，不确定我是否在正确的位置应用
struct menu : View {
@Binding var size : CGFloat
@State var expand: Bool = false
@State var sideMenuEntries = [
SideMenuData(index: 0, imageName: "info.circle.fill",
menuText: "Menu Text 1",
subMenu: [""],
expand: false),
SideMenuData(index: 1, imageName: "doc.on.doc.fill",
menuText: "Menu 2",
subMenu: [""],
expand: false)
]
var body : some View{
VStack{
HStack{
Spacer()
Button(action: {
self.size = UIScreen.main.bounds.width / 1.6
}) {
Image("close").resizable()
.frame(width: 15, height: 15)
.padding()
}
.foregroundColor(.white)
.clipShape(Circle())
}
ForEach (sideMenuEntries.indices) { index in
//VStack (alignment: .leading, spacing: 0, content: {
VStack (alignment: .leading, spacing: 0, content: {
HStack{
Image(systemName: self.sideMenuEntries[index].imageName).resizable().frame(width: 25, height: 25)//.padding(.leading, 5)
.foregroundColor(.white)
Text(self.sideMenuEntries[index].menuText).fontWeight(.heavy).foregroundColor(.white)
Image(systemName: self.sideMenuEntries[index].expand ? "chevron.compact.up" : "chevron.compact.down")
.resizable()
.frame(width: 10, height: 10)
.foregroundColor(.white)
}
.contentShape(Rectangle())
.onTapGesture {
self.sideMenuEntries[index].expand.toggle()
}
if self.sideMenuEntries[index].expand {
Button(action: {
}){
VStack (alignment: .leading){
Text("Sub Menu 1")
.foregroundColor(.white)
Text("Sub 2")
.foregroundColor(.white)
Text("Sub Menu 3")
.foregroundColor(.white)
Text("Sub 4")
.foregroundColor(.white)
}
.padding([.top, .bottom], 4)
.padding(.leading, 14)
}
}
})
}
Spacer()
}
.frame(width: UIScreen.main.bounds.width / 1.3)
.background(LinearGradient(
gradient: Gradient(
colors: [.buttonGradientStartColor, .buttonGradientEndColor]),
startPoint: .top,
endPoint: .bottom))
}
}
【问题讨论】：
标签： ios swift xcode swiftui side-menu