Диаграммы IOS в ScrollView - PullRequest
Новая
       24

Диаграммы IOS в ScrollView

0 голосов
/ 15 декабря 2018

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

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

Я использую Графики.https://github.com/danielgindi/Charts

Это тестовый код.Я уверен, что делаю что-то глупое. 

import UIKit
import Charts

class ScrollViewController: UIViewController {

    //    @IBOutlet weak var pieChart: PieChartView!

    lazy var scrollView: UIScrollView = {
        let view = UIScrollView()
        view.translatesAutoresizingMaskIntoConstraints = false
        view.contentSize.height = 2000
        return view
    }()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.addSubview(scrollView)
        setupScrollView()


    }

    func setupScrollView(){

        scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
        scrollView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        scrollView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true

        // add the chart

        let entry1 = PieChartDataEntry(value: 3.4, label: "first")
        let entry2 = PieChartDataEntry(value: 4.1, label: "second")
        let dataSet = PieChartDataSet(values: [entry1, entry2 ], label: "Test chart")

        let chart = UIView()

        chart.frame.size = CGSize(width: 400, height: 300)
        chart.frame.origin = CGPoint(x: 0, y: 100)
        chart.backgroundColor = UIColor.white

        let viewCustom = PieChartView()
        viewCustom.data = PieChartData(dataSet: dataSet)

        chart.addSubview(viewCustom)

        scrollView.addSubview( chart )

    }

}

Использование Swift 4.2 и Xcode 10.

Спасибо.

1 Ответ

0 голосов
/ 15 декабря 2018

ScrollViews иногда может быть немного сложнее.При необходимости я обращался бы к этому руководству: Документация Apple по настройке UIScrollViews с автозапуском

Быстрое решение

  • Вы не настраиваетеограничения для диаграммы правильно в scrollView.UIScrollView s работают немного иначе с ограничениями, и есть некоторые лучшие практики, которые часто лучше всего придерживаться (см. Ссылку выше).Тем не менее, быстрое решение - просто установить chart.translatesAutoresizingMaskIntoConstraints = false, а затем установить правильные ограничения для диаграммы в scrollView.

Подробный ответ (включая рекомендации по UIScrollView)

Исходя из вашего примера кода, вам нужно сделать следующие несколько вещей (я также включил некоторые лучшие практики для scrollviews, как указано в документах Apple).

  • Сначала (Если диаграммы должны быть взаимозаменяемыми, перейдите к следующей «точке» и добавьте диаграмму в scrollView напрямую без представления контейнера) .Добавьте UIView в качестве контейнера для scrollView.Ограничьте этот контейнерный вид, ведущий, тянущийся, верхний, нижний к соответствующей привязке scrollViewТакже, если вы хотите отключить прокрутку по горизонтали: установите привязку ширины представления контейнера, равную привязке ширины scrollView.Не забудьте установить translatesAutoresizingMaskIntoConstraints = false.

  • Во-вторых: Установить translatesAutoresizingMaskIntoConstraints = false для графика.Затем добавьте его в контейнер или представление прокрутки.И установить его ограничения в своем суперпредставлении!(Если диаграммы имеют динамический размер, такой как метки, вам нужно только одно ограничение x и y, в противном случае убедитесь, что высота и ширина также рассчитываются исходя из ваших ограничений.).Если вы хотите, чтобы диаграмма была центрирована по горизонтали в scrollView.Установите chart.centerXanchor.constraint(equalTo: scrollView.centerXanchor).isActive = true, затем chart.widthAnchor.constraint (равный scrollView.widthAnchor, constant: (вычтите или добавьте константу, если необходимо)). IsActive = true`.Начиная с установки начального и

  • И наконец Не устанавливайте contentSize прокрутки при его запуске.Переопределите «viewDidLayoutSubviews ()» контроллера представления, вызовите «super.viewDidLayoutSubviews ()», затем установите «scrollView.contentSize = CGSize (width: scrollView.frame.width, height: 2000)» или любую другую высоту, если вы этого не хотите.будьте динамичными.

  • В качестве примечания: , если вы хотите, чтобы scrollView также отражался вертикально (на ощупь).В блоке инициализации scrollView установите: «scrollView.bounces = true» и «scrollView.alwaysBounceVertically = true».Также я не вижу причин, по которым scrollView стал ленивым var?Если вы загружаете его каждый раз, когда загружается UIViewController, более удобно объявить его как константу.

Редактировать

  • Включаяпример.Вы можете изменить макет в зависимости от того, как он будет выглядеть.(Не смешивайте макеты с автоматическим макетом с макетом без автоматического макета в scrollViews. Его проще использовать.) Измените setupScrollView() на этот. 

    // Change your scrollView declaration to this if you want it to always bounce.
let scrollView : UIScrollView = {
    let sView = UIScrollView()
    sView.translatesAutoresizingMaskIntoConstraints = false
    sView.bounces = true
    sView.alwaysBounceVertical = true
    sView.contentSize.height = 2000 // I would recommend setting `scrollView.contentSize` in `viewDidLayoutSubviews()` instead. If you are not using the container View approach.
}()

let containerView = UIView() // constant for the containerView.

func setupScrollView(){

    scrollView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
    scrollView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true
    scrollView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
    scrollView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true

    // Setting up containerView and disabling horizontal scrolling of the scrollView.

    containerView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.addSubview(containerView)
    containerView.topAnchor.constraint(equalTo: scrollView.topAnchor).isActive = true
    containerView.bottomAnchor.constraint(equalTo: scrollView.bottomAnchor).isActive = true
    containerView.leftAnchor.constraint(equalTo: scrollView.leftAnchor).isActive = true
    containerView.rightAnchor.constraint(equalTo: scrollView.rightAnchor).isActive = true
    containerView.widthAnchor.constraint(equalTo: scrollView.widthAnchor).isActive = true

    // add the chart

    let entry1 = PieChartDataEntry(value: 3.4, label: "first")
    let entry2 = PieChartDataEntry(value: 4.1, label: "second")
    let dataSet = PieChartDataSet(values: [entry1, entry2 ], label: "Test chart")

    // Make sure your chart is setup correctly here as `chart`
    let chart = PieChartView()
    chart.data = PieChartData(dataSet: dataSet)
    chart.translatesAutoresizingMaskIntoConstraints = false

    containerView.addSubview(chart)

    chart.topAnchor.constraint(equalTo: containerView.topAnchor, constant: 100).isActive = true
    chart.centerXAnchor.constraint(equalTo: containerView.centerXAnchor).isActive = true
    chart.widthAnchor.constraint(equalToConstant: 400).isActive = true
    chart.heightAnchor.constraint(equalToConstant: 300).isActive = true
    // Constrain next charts top anchor to the bottom anchor of this chart if you want multiple charts on a vertical axis.

}

Помогает ли этоты?

...