Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Trailing connecting line after the last step when .top aligned #83

Open
paul4156 opened this issue May 24, 2021 · 6 comments
Open

Trailing connecting line after the last step when .top aligned #83

paul4156 opened this issue May 24, 2021 · 6 comments
Assignees

Comments

@paul4156
Copy link

Describe the bug
There will be a trailing line after the last step, when alignment is .top and last step has multiple lines of text

To Reproduce

    let steps = [ Text("Cart").font(.caption),
                  Text("Delivery Address").font(.caption),
                  Text("Order Summary").font(.caption),
                  Text("Payment Method").font(.caption),
                  Text("Track\nTracking\nTracking").font(.caption)]

    let indicationTypes = [StepperIndicationType.custom(NumberedCircleView(text: "1")),
                            .custom(NumberedCircleView(text: "2")),
                            .custom(NumberedCircleView(text: "3")),
                            .custom(NumberedCircleView(text: "4")),
                            .custom(NumberedCircleView(text: "5"))]

    var body: some View {
        StepperView()
            .addSteps(steps)
            .indicators(indicationTypes)
            .stepIndicatorMode(StepperMode.vertical)
            .spacing(30)
            .alignments([StepperAlignment.top, .top, .top, .top, .top])
            .lineOptions(StepperLineOptions.custom(1, Colors.blue(.teal).rawValue))
    }

Expected behavior
Hide the trailing line

Screenshots
https://tinypng.com/web/output/08ageudqwq54yxpuu02az1vmt7gze0mt/Screen%20Shot%202021-05-24%20at%2010.06.46%20am.png

Info (please complete the following information):

  • Device: iPhone 12 simulator
  • OS: iOS 13
  • Pod Version (What is this?)
  • Xcode Version 12.5 (12E262)

Additional context
None. Thanks for helping.

@badrinathvm
Copy link
Owner

badrinathvm commented May 24, 2021

Hi @paul4156 Thank you for checking out the library. U can simply set the alignments of the last one to .center

StepperView()
           .addSteps(steps)
           .indicators(indicationTypes)
           .stepIndicatorMode(StepperMode.vertical)
           .spacing(30)
           .alignments([StepperAlignment.top, .top, .top, .top, .center])
           .lineOptions(StepperLineOptions.custom(1, Colors.blue(.teal).rawValue))

Screen Shot 2021-05-23 at 5 19 45 PM

@paul4156 paul4156 changed the title Trailing connecting lines after the last step when .top aligned Trailing connecting line after the last step when .top aligned May 24, 2021
@paul4156
Copy link
Author

Hi @paul4156 Thank you for checking out the library. U can simply set the alignments of the last one to .center

StepperView()
           .addSteps(steps)
           .indicators(indicationTypes)
           .stepIndicatorMode(StepperMode.vertical)
           .spacing(30)
           .alignments([StepperAlignment.top, .top, .top, .top, .center])
           .lineOptions(StepperLineOptions.custom(1, Colors.blue(.teal).rawValue))

Screen Shot 2021-05-23 at 5 19 45 PM

Thank you for your help.

But that is not what I needed. In my app, the first line is "step title", and the second line is "step details", which can be multi-lines.
For each step, I need to align the icon to the "title" (first) line, hence cannot use .center alignment.
That is the whole point I am using .top alignment for all my steps.

@badrinathvm
Copy link
Owner

Got it, let me work on a fix and get back to u shortly with updated version.

@badrinathvm
Copy link
Owner

badrinathvm commented May 24, 2021

@paul4156 I have fixed the issue and released a new version pod 'StepperView','~> 1.6.6' See the attached screenshot. Please test ur scenarios using 1.6.6. Also, i would appreciate, if u can mention the name of the app in the App store you are using this for. This would help the library to reach a wider audience.

simulator_screenshot_92F2CD2B-2A65-4313-84C9-7424DF6FE163

@paul4156
Copy link
Author

paul4156 commented May 24, 2021

I am sorry, but I am still getting the trailing line after the last step icon.
And in your above example, the last step seems to be .center aligned, not .top aligned.

image

Your help is greatly appreciated and I will definitely credit this wonderful package in my app.

@badrinathvm
Copy link
Owner

Thank you for the credits @paul4156. Looks like one of my commits got missed. Will generate a new version and let u know shortly.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants