Merge pull request #1182 from meshtastic/clickableNodeCircles

Clickable node circles
This commit is contained in:
Garth Vander Houwen 2025-04-22 18:53:40 -07:00 committed by GitHub
commit 91f9f7380f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 42 additions and 28 deletions

View file

@ -4,29 +4,43 @@ A view draws a circle in the background of the shortName text
*/
import SwiftUI
import CoreData
struct CircleText: View {
var text: String
var color: Color
var text: String
var color: Color
var circleSize: CGFloat = 45
var node: NodeInfoEntity? = nil
var body: some View {
if let node = node {
NavigationStack{
NavigationLink(destination: NodeDetail(node: node)) {
circleContent
}
}
var body: some View {
} else {
circleContent
}
}
ZStack {
Circle()
.fill(color)
.frame(width: circleSize, height: circleSize)
Text(text.addingVariationSelectors)
var circleContent: some View {
ZStack {
Circle()
.fill(color)
.frame(width: circleSize, height: circleSize)
Text(text)
.frame(width: circleSize * 0.9, height: circleSize * 0.9, alignment: .center)
.foregroundColor(color.isLight() ? .black : .white)
.minimumScaleFactor(0.001)
.font(.system(size: 1300))
}
}
}
}
}
struct CircleText_Previews: PreviewProvider {
static var previews: some View {
static var previews: some View {
VStack {
HStack {
CircleText(text: "N1", color: Color.yellow, circleSize: 80)
@ -75,5 +89,5 @@ struct CircleText_Previews: PreviewProvider {
.previewLayout(.fixed(width: 300, height: 100))
}
}
}
}
}

View file

@ -48,7 +48,7 @@ struct ChannelMessageList: View {
HStack(alignment: .bottom) {
if currentUser { Spacer(minLength: 50) }
if !currentUser {
CircleText(text: message.fromUser?.shortName ?? "?", color: Color(UIColor(hex: UInt32(message.fromUser?.num ?? 0))), circleSize: 44)
CircleText(text: message.fromUser?.shortName ?? "?", color: Color(UIColor(hex: UInt32(message.fromUser?.num ?? 0))), circleSize: 44, node: getNodeInfo(id: Int64(message.fromUser?.num ?? 0), context: context))
.padding(.all, 5)
.offset(y: -7)
}
@ -160,8 +160,8 @@ struct ChannelMessageList: View {
.toolbar {
ToolbarItem(placement: .principal) {
HStack {
CircleText(text: String(channel.index), color: .accentColor, circleSize: 44).fixedSize()
Text(String(channel.name ?? "unknown".localized).camelCaseToWords()).font(.headline)
CircleText(text: String(channel.index), color: .accentColor, circleSize: 44).fixedSize()
Text(String(channel.name ?? "unknown".localized).camelCaseToWords()).font(.headline)
}
}
ToolbarItem(placement: .navigationBarTrailing) {

View file

@ -23,10 +23,10 @@ struct PositionPopover: View {
var body: some View {
// Node Color from node.num
let nodeColor = UIColor(hex: UInt32(position.nodePosition?.num ?? 0))
NavigationStack{
VStack {
HStack {
ZStack {
if position.nodePosition?.isOnline ?? false {
Circle()
.fill(Color(nodeColor.lighter()).opacity(0.4).shadow(.drop(color: Color(nodeColor).isLight() ? .black : .white, radius: 5)))
@ -34,16 +34,15 @@ struct PositionPopover: View {
.scaleEffect(scale)
.animation(
Animation.easeInOut(duration: 0.6)
.repeatForever().delay(delay), value: scale
.repeatForever().delay(delay), value: scale
)
.onAppear {
self.scale = 1
}
.frame(width: 90, height: 90)
}
CircleText(text: position.nodePosition?.user?.shortName ?? "?", color: Color(nodeColor), circleSize: 65)
CircleText(text: position.nodePosition?.user?.shortName ?? "?", color: Color(nodeColor), circleSize: 65, node: getNodeInfo(id: Int64(position.nodePosition?.user?.num ?? 0), context: context))
}
Text(position.nodePosition?.user?.longName ?? "Unknown")
.font(.largeTitle)
}
@ -106,7 +105,7 @@ struct PositionPopover: View {
.foregroundColor(.primary)
.font(idiom == .phone ? .callout : .body)
}
} icon: {
Image(systemName: "mountain.2.fill")
.symbolRenderingMode(.hierarchical)
@ -147,9 +146,9 @@ struct PositionPopover: View {
Text("Heading: \(heading.formatted(.measurement(width: .narrow, numberFormatStyle: .number.precision(.fractionLength(0)))))")
} icon: {
Image(systemName: "location.north")
.symbolRenderingMode(.hierarchical)
.frame(width: 35)
.rotationEffect(degrees)
.symbolRenderingMode(.hierarchical)
.frame(width: 35)
.rotationEffect(degrees)
}
.padding(.bottom, 5)
/// Distance
@ -181,15 +180,15 @@ struct PositionPopover: View {
}
.padding(.bottom, 5)
if position.nodePosition?.viaMqtt ?? false {
Label {
Text("MQTT")
.font(idiom == .phone ? .callout : .body)
} icon: {
Image(systemName: "network")
.symbolRenderingMode(.hierarchical)
.frame(width: 35)
.rotationEffect(degrees)
.symbolRenderingMode(.hierarchical)
.frame(width: 35)
.rotationEffect(degrees)
}
.padding(.bottom, 5)
}
@ -244,6 +243,7 @@ struct PositionPopover: View {
#endif
}
}
}
.presentationDetents([.fraction(0.65), .large])
.presentationContentInteraction(.scrolls)
.presentationDragIndicator(.visible)

View file

@ -520,6 +520,7 @@ struct NodeDetail: View {
}
}
.listStyle(.insetGrouped)
.navigationBarTitle(String(node.user?.longName?.addingVariationSelectors ?? "unknown".localized), displayMode: .inline)
}
}
}

View file

@ -264,7 +264,6 @@ struct NodeList: View {
columnVisibility: columnVisibility
)
.edgesIgnoringSafeArea([.leading, .trailing])
.navigationBarTitle(String(node.user?.longName?.addingVariationSelectors ?? "unknown".localized), displayMode: .inline)
.navigationBarItems(
trailing: ZStack {
if UIDevice.current.userInterfaceIdiom != .phone {