How to remove the separator line of navigation bar in swiftui? - swiftui

Not able to remove the separator line. Tried setting background image and adding attributes, setting background colour but none of these are working.
After setting isTranslucent true, for colours other than white separator is not visible but in case of white it is visible.
init() {
UINavigationBar.appearance().isTranslucent = false
}
and I am using .navigationBarTitleDisplayMode(.inline)

Related

How to display same background color when sheet is opened?

I have a page which has a dark blue background color. When a button is pressed, a sheet is opened, however behind the sheet the blue background shifts down and it shows a white background. How can I prevent this?
ZStack {
setBackgroundColor.darkBlue
.ignoresSafeArea(.all)
HStack {
Button(action: {
self.showSheet = true
}) {
Text("Add exercise")
.frame(maxWidth: .infinity)
.frame(height: 10)
.foregroundColor(CustomColor.darkBlue)
.padding()
.background(CustomColor.cyan)
}
.clipShape(Capsule())
.sheet(isPresented: $showSheet) {
AddWorkoutSheet()
}
}
.padding(.bottom)
}
Blue background shifted when sheet is opened.
I have tried to find out what is wrong, but I cannot seem to figure it out. I quite new to programming and SwiftUI.
It is not shifting down, it is just how sheet works. When you toggle a sheet, it will pop out from the bottom with a default white background, therefore covering the background of your root view. So what you want might be a transparent sheet. If this is the case, using sheet may not be the best way as implementing a transparent sheet needs some walkaround. You may instead try using a transition to move the view up or down with offset.

How to get TabView .page background style to stick

I have a bunch of TabViews in my view structure all with .tabViewStyle(.page) to get paged tab views with the little dots to cycle through some pictures. I want the dots to have a background so they can be seen regardless of the picture contents.
I tried lots of things (labels, tints, foreground colors, background colors, etc.) but nothing worked. I eventually guessed my way into
TabView {
// My Image views
}
.tabViewStyle(.page)
.onAppear {
UIPageControl.appearance().backgroundStyle = .prominent
}
Which does exactly what I want! Until I swipe to the next picture and then the background disappears...
How do I get the backgroundStyle on the TabView to stay?
You can set the indexViewStyle to always show
TabView {
// My Image views
}
.tabViewStyle(.page)
..indexViewStyle(.page(backgroundDisplayMode: .always)) <-- HERE

Can I change a ButtonToggleStyle deselected background color in SwiftUI?

Toggles in SwiftUI have a .tint modifier to set their color when toggled on but I'd like to set a toggle's background color when off, specifically when using .toggleStyle(.button). Is there any way to do so?
Do it in the same way
Toggle("Test", isOn: $isOn)
.toggleStyle(.button)
.tint(.red)
Off state is as expected:

Remove Outline on Right-clicked Rows in SwiftUI Mac App List

I'm building a macOS app with SwiftUI, and I'm trying to remove (or even cover up) the border added to a List item when I right-click it.
Here it is by default:
Now with a right-click and a contextMenu view modifier:
I figured this is an NSTableView quirk, so I tried the approaches in these three Stack Overflow posts:
Customize right click highlight on view-based NSTableView
NSTableView with menu, how to change the border color with right click?
Disabling the NSTableView row focus ring
NSTableView: blue outline on right-clicked rows
I couldn't get any of those to work, and that may be due to the fact that I can't subclass an NSTableView, but can only override its properties and methods with an extension. Here's what I have so far that successfully removes the default table background and such:
extension NSTableView{
open override func viewDidMoveToWindow() {
super.viewDidMoveToWindow()
//Remove default table styles
backgroundColor = NSColor.clear
enclosingScrollView!.drawsBackground = false
selectionHighlightStyle = .none
}
}
Is there any way to remove that right-click border in SwiftUI? I'm even open to covering it with other views, but I can't seem to draw SwiftUI views in that space around the table cell.
I found a workaround for this. I put my List in a ZStack and then set its opacity to zero. I then built out a fully custom version of the same list, but using LazyVStack:
//Message List
ZStack{
//Ghost list for keyboard control
List($model.messages, id: \.self, selection: $model.selectedMessages){ $message in
MessageItemView(message: $message)
}
.focusable()
.opacity(0)
//Custom UI for the above List
ScrollView{
ZStack{
LazyVStack(spacing: 5){
ForEach($model.messagesToday){ $message in
MessageItemView(message: $message)
}
}
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
}
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
Each list is bound to the same model, so if I click a message to select it in the custom UI, the same thing gets selected in the invisible List. All the keyboard shortcuts that come with table use in a List look like they are working on the custom version.
So how does this solve my original problem? You can right-click on the custom MessageItemView and the default ring around the cell is invisible, but the contextMenu still works (it's defined inside my MessageItemView).
This isn't as elegant as I'd like, but it's nice to have 100% control over the UI but still get all the keyboard controls that come for free with a List.

Navigation Bar Background Color Light with Swift 3

I add Navigation Bar in any view controller. But, I'm adding new CollectionView Controller in project. My problem is that I could not add Navigation Bar in Collection View Controller.
So I add Navigation Bar with code. I choose Top Bar- "Inferred" in Attributes Inspector. Here is the code.
//Add Navigation Bar
let height: CGFloat = 65
let navbar = UINavigationBar(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: height))
navbar.delegate = self
UINavigationBar.appearance().barTintColor = UIColor(red: 0.0/255.0, green:49.0/255.0, blue:79.0/255.0, alpha:0.1)
UINavigationBar.appearance().tintColor = UIColor.white
UINavigationBar.appearance().isTranslucent = true
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName : UIColor.white]
But, the Navigation Bar Background Color in Collection View Controller is a little bit dark than other view controller.
In other view controller, I drag and put navigation bar.
- Navigation Bar style --> Black
- Translucent --> not enabled
- Bar Tint Color --> #00314F
I don't know why Navigation Bar Background Color in Collection View Controller is light than in Collection View Controller.
Please help me how to match Navigation Bar Background Color in all view controller.
If it is not easy to do, is there any ways to add Navigation Bar in CollectionViewController without embedded in Navigation Controller and without code.
It is beacause of the Translucent property of NavigationBar. It gives an effect where the image color looks faded as if a layer has been put on the bar, hence the color looks a little and different. Set off the translucent property of navigation bar as shown below. You can write this code in any lifecycle methods.
self.navigationController?.navigationBar.isTranslucent = false
It is because of translucent i think. When the navigation bar is not translucent, view can't locate behind the navigation bar to show what it has. But when is translucent, view stays behind the navigation bar and with view's color, you see it darker.