Выравнивание прямоугольника по низу в режиме ScrollView / GeometryReader не работает

#ios #swift #xcode #swiftui #geometryreader

Вопрос:

Я пытаюсь выровнять прямоугольник в представлении GeometryReader, который вложен в HStack, а затем в ScrollView.

Я не могу выровнять Rect() по нижней части представления, оно рисуется только сверху.

Это не работает, прямоугольник рисуется сверху, а не снизу представления.

Как мне это исправить? Я попытался установить выравнивание .bottom для всех представлений и фреймов, но ни один из них не работает.

Если требуется дополнительное разъяснение, пожалуйста, дайте мне знать.

Я обновил свой код до реального примера.

 
import SwiftUI



struct Scrollview1: View {
    
    
    let samples = [106, 77, 53, 15, 83, 80, 63, 43, 80, 81, 66, 75, 78, 57, 18, 73, 80, 70, 27, 82, 83, 70, 66, 78, 50, 30, 13, 77, 67, 40, 12, 76, 73, 73, 77, 63, 42, 12, 88, 77, 46, 14, 90, 83, 73, 79, 73, 34, 14, 87, 78, 53, 37, 79, 75, 19, 86, 74, 45, 14, 79, 81, 46, 14, 82, 76, 44, 69, 70, 37, 13, 80, 81, 48, 15, 76, 79, 41, 76, 75, 49, 26, 79, 78, 57, 18, 79]
    
    
    var body: some View {
        
        
        
        ScrollView(.horizontal, showsIndicators: false) {
    
            VStack (spacing: 3) {
                
                
                HStack (alignment: .bottom , spacing: 1) {
                    
                    ForEach(samples, id: .self) { sample in
                        
                        GeometryReader { geo in
                            
                            Rectangle()
                                .fill( geo.frame(in: .global).maxX >  100 amp;amp; 250 > geo.frame(in: .global).maxX  ? Color.red : Color.gray)
                            //  .frame( alignment: .leading)
                                .frame(width: 5, height: CGFloat(sample))
                            
                        }
                     }
                }
            }
        }
        
    }
}
struct Scroll_Previews1: PreviewProvider {
    static var previews: some View {
        Scrollview1()
    }
}

1. Похоже, вы хотите изменить вид прокрутки, как в новых элементах, которые начинаются снизу и прокручиваются вверх. Если это так, см. Это сообщение в блоге . Если нет, то что именно вы хотите?

2. Поэтому я хочу, чтобы прямоугольник был выделен в нижней части вида. итак, это сталагмит, а не сталагмит.

3. @Yrb Я добавил изображение того, как это выглядит.

4. Но что еще происходит в ScrollView ? Если ничего другого, зачем это использовать? Это было бы намного проще без ScrollView .

5. @Yrb это упрощенный пример. В scrollview будет много прямоугольников. Поэтому, если вы попробуете использовать один (или несколько) прямоугольников, вы увидите проблему.

Ответ №1:

Я думаю, это то, что вы ищете. Когда объект ScrollView переходит в GeometryReader режим, он выравнивается по верхнему краю с видом. Я поместил фон Scrollview , чтобы вы могли видеть, что он был всего лишь высотой 50. Ваша проблема не в ScrollView этом, а в том GeometryReader . ScrollView Должно быть в a VStack с a Spacer() выше, чтобы опустить его.

     GeometryReader { geometry in
        VStack {
            Spacer()
            ScrollView(.horizontal){
                HStack(spacing: 10) {
                    ForEach(0..<30) { index in
                        Rectangle()
                            .frame(width: 10, height: CGFloat.random(in: 20...50))
                    }
                }
            }
            .background(Color.red)
        }
        .padding()
    }