チャット画面デザイン完成

Seilassist/Sailassist.xcodeproj/project.pbxproj

@@ -48,7 +48,8 @@
 		02A1DE312AFB61D8005BCF55 /* MyChatContentView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02A1DE302AFB61D8005BCF55 /* MyChatContentView.swift */; };
 		02A1DE332AFB654A005BCF55 /* CustomCornerRadius.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02A1DE322AFB654A005BCF55 /* CustomCornerRadius.swift */; };
 		02C3E5CE2AFCA04700AF7837 /* OtherChatContentView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02C3E5CD2AFCA04700AF7837 /* OtherChatContentView.swift */; };
-		02C3E5D12AFCC16800AF7837 /* NavigationTitleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02C3E5D02AFCC16800AF7837 /* NavigationTitleView.swift */; };
+		02C3E5D12AFCC16800AF7837 /* ChatTitleView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02C3E5D02AFCC16800AF7837 /* ChatTitleView.swift */; };
+		02C3E6092AFDF30000AF7837 /* ChatMemberView.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02C3E6082AFDF30000AF7837 /* ChatMemberView.swift */; };
 		02CD068F2AE6535F005F8D8F /* MapSource.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02CD068E2AE6535F005F8D8F /* MapSource.swift */; };
 		02CD06912AE6536B005F8D8F /* LayerEnum.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02CD06902AE6536B005F8D8F /* LayerEnum.swift */; };
 		02CD06932AE88970005F8D8F /* ServerSession.swift in Sources */ = {isa = PBXBuildFile; fileRef = 02CD06922AE88970005F8D8F /* ServerSession.swift */; };
@@ -144,7 +145,8 @@
 		02A1DE302AFB61D8005BCF55 /* MyChatContentView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = MyChatContentView.swift; path = Sailassist/Chat/View/MyChatContentView.swift; sourceTree = SOURCE_ROOT; };
 		02A1DE322AFB654A005BCF55 /* CustomCornerRadius.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = CustomCornerRadius.swift; path = Sailassist/Chat/View/CustomCornerRadius.swift; sourceTree = SOURCE_ROOT; };
 		02C3E5CD2AFCA04700AF7837 /* OtherChatContentView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = OtherChatContentView.swift; path = Sailassist/Chat/View/OtherChatContentView.swift; sourceTree = SOURCE_ROOT; };
-		02C3E5D02AFCC16800AF7837 /* NavigationTitleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = NavigationTitleView.swift; path = Sailassist/Tab/View/NavigationTitleView.swift; sourceTree = SOURCE_ROOT; };
+		02C3E5D02AFCC16800AF7837 /* ChatTitleView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = ChatTitleView.swift; path = SailAssist/Chat/View/ChatTitleView.swift; sourceTree = SOURCE_ROOT; };
+		02C3E6082AFDF30000AF7837 /* ChatMemberView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; name = ChatMemberView.swift; path = Sailassist/Chat/View/ChatMemberView.swift; sourceTree = SOURCE_ROOT; };
 		02CD068E2AE6535F005F8D8F /* MapSource.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = MapSource.swift; sourceTree = "<group>"; };
 		02CD06902AE6536B005F8D8F /* LayerEnum.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LayerEnum.swift; sourceTree = "<group>"; };
 		02CD06922AE88970005F8D8F /* ServerSession.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ServerSession.swift; sourceTree = "<group>"; };
@@ -423,10 +425,12 @@
 		02A1DE2D2AFB497B005BCF55 /* View */ = {
 			isa = PBXGroup;
 			children = (
+				02C3E5D02AFCC16800AF7837 /* ChatTitleView.swift */,
 				02A1DE2E2AFB4AA0005BCF55 /* ChatInputView.swift */,
 				02A1DE302AFB61D8005BCF55 /* MyChatContentView.swift */,
 				02C3E5CD2AFCA04700AF7837 /* OtherChatContentView.swift */,
 				02A1DE322AFB654A005BCF55 /* CustomCornerRadius.swift */,
+				02C3E6082AFDF30000AF7837 /* ChatMemberView.swift */,
 			);
 			path = View;
 			sourceTree = "<group>";
@@ -434,7 +438,6 @@
 		02C3E5CF2AFCC15700AF7837 /* View */ = {
 			isa = PBXGroup;
 			children = (
-				02C3E5D02AFCC16800AF7837 /* NavigationTitleView.swift */,
 			);
 			path = View;
 			sourceTree = "<group>";
@@ -648,6 +651,7 @@
 				02CD06952AE895F5005F8D8F /* APIError.swift in Sources */,
 				022A98202AF8B8960079C55A /* LocationCalculation.swift in Sources */,
 				02CE4DC82ADF97E8002E79BC /* View+Extensions.swift in Sources */,
+				02C3E6092AFDF30000AF7837 /* ChatMemberView.swift in Sources */,
 				020B98412AD8C3810029DE4C /* LoginView.swift in Sources */,
 				D5AE351D2AEBA6FC00059889 /* SessionLogin.swift in Sources */,
 				020B98552AD924930029DE4C /* QrCodeScannerView.swift in Sources */,
@@ -682,7 +686,7 @@
 				02CE4D892ADF62E1002E79BC /* EcaSettingView.swift in Sources */,
 				02CE4D872ADF62A7002E79BC /* EcaListView.swift in Sources */,
 				020B986C2ADD3E810029DE4C /* InTextLib.swift in Sources */,
-				02C3E5D12AFCC16800AF7837 /* NavigationTitleView.swift in Sources */,
+				02C3E5D12AFCC16800AF7837 /* ChatTitleView.swift in Sources */,
 				020B98472AD8FEE30029DE4C /* ColorSet.swift in Sources */,
 				020B98652ADD14F60029DE4C /* NotificationView.swift in Sources */,
 			);

Seilassist/Sailassist/Assets.xcassets/ColorSet/LineColor/LineColor04.colorset/Contents.json

+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.150",
+          "blue" : "0x3C",
+          "green" : "0x38",
+          "red" : "0x38"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.200",
+          "blue" : "0xFF",
+          "green" : "0xFF",
+          "red" : "0xFF"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Seilassist/Sailassist/Assets.xcassets/ColorSet/LineColor/LineModalColor.colorset/Contents.json

+{
+  "colors" : [
+    {
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.150",
+          "blue" : "0x3C",
+          "green" : "0x38",
+          "red" : "0x38"
+        }
+      },
+      "idiom" : "universal"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "color" : {
+        "color-space" : "srgb",
+        "components" : {
+          "alpha" : "0.400",
+          "blue" : "0x39",
+          "green" : "0x36",
+          "red" : "0x36"
+        }
+      },
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert.imageset/Contents.json

+{
+  "images" : [
+    {
+      "filename" : "chat_alert_1.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "chat_alert.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert.imageset/chat_alert.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="#FFF">
+    <defs>
+        <style>.cls-1,.cls-2{stroke-width:0px;}.cls-2{fill:none;opacity:.1;}</style>
+    </defs>
+    <g id="_レイヤー_1-2">
+        <rect class="cls-2" width="22" height="22" />
+        <path class="cls-1"
+            d="m15.8,12.61c.3-1.77-.39-3.41-1.96-4.09-.01,0-.02-.02-.02-.03l.05-.31c.08-.44-.16-.91-.59-1.05-.52-.16-1.05.17-1.14.69l-.07.39c-1.73.11-2.92,1.43-3.22,3.21l-.49,2.88s0,.01-.01.02l-1.33.95s0,.01-.01.02l-.1.57,9.25,1.57.1-.57s0-.01,0-.02l-.95-1.33s0-.01,0-.02l.49-2.88Zm-4.55,5.77c.08.01.16.02.24.02.39-.02.74-.22.95-.54.08-.13.14-.27.16-.44l-2.28-.39s-.03,0-.03.02c-.08.63.34,1.22.97,1.32Z" />
+        <path class="cls-1"
+            d="m7.64,9.26c-.28,0-.5-.22-.5-.5,0-1.41,1.14-2.55,2.55-2.55.28,0,.5.22.5.5s-.22.5-.5.5c-.85,0-1.55.69-1.55,1.55,0,.28-.22.5-.5.5Z" />
+        <path class="cls-1"
+            d="m4.91,8.58c-.28,0-.5-.22-.5-.5,0-2.69,2.18-4.87,4.87-4.87.28,0,.5.22.5.5s-.22.5-.5.5c-2.13,0-3.87,1.74-3.87,3.87,0,.28-.22.5-.5.5Z" />
+    </g>
+</svg>
\ No newline at end of file

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert.imageset/chat_alert_1.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="#38383c">
+    <defs>
+        <style>.cls-1,.cls-2{stroke-width:0px;}.cls-2{fill:none;opacity:.1;}</style>
+    </defs>
+    <g id="_レイヤー_1-2">
+        <rect class="cls-2" width="22" height="22" />
+        <path class="cls-1"
+            d="m15.8,12.61c.3-1.77-.39-3.41-1.96-4.09-.01,0-.02-.02-.02-.03l.05-.31c.08-.44-.16-.91-.59-1.05-.52-.16-1.05.17-1.14.69l-.07.39c-1.73.11-2.92,1.43-3.22,3.21l-.49,2.88s0,.01-.01.02l-1.33.95s0,.01-.01.02l-.1.57,9.25,1.57.1-.57s0-.01,0-.02l-.95-1.33s0-.01,0-.02l.49-2.88Zm-4.55,5.77c.08.01.16.02.24.02.39-.02.74-.22.95-.54.08-.13.14-.27.16-.44l-2.28-.39s-.03,0-.03.02c-.08.63.34,1.22.97,1.32Z" />
+        <path class="cls-1"
+            d="m7.64,9.26c-.28,0-.5-.22-.5-.5,0-1.41,1.14-2.55,2.55-2.55.28,0,.5.22.5.5s-.22.5-.5.5c-.85,0-1.55.69-1.55,1.55,0,.28-.22.5-.5.5Z" />
+        <path class="cls-1"
+            d="m4.91,8.58c-.28,0-.5-.22-.5-.5,0-2.69,2.18-4.87,4.87-4.87.28,0,.5.22.5.5s-.22.5-.5.5c-2.13,0-3.87,1.74-3.87,3.87,0,.28-.22.5-.5.5Z" />
+    </g>
+</svg>
\ No newline at end of file

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert_none.imageset/Contents.json

+{
+  "images" : [
+    {
+      "filename" : "chat_alert_none_1.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "filename" : "chat_alert_none.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    },
+    {
+      "appearances" : [
+        {
+          "appearance" : "luminosity",
+          "value" : "dark"
+        }
+      ],
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert_none.imageset/chat_alert_none.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="#FFF">
+    <defs>
+        <style>.cls-1,.cls-2{stroke-width:0px;}.cls-2{fill:none;opacity:.1;}</style>
+    </defs>
+    <g id="_レイヤー_1-2">
+        <rect class="cls-2" width="22" height="22" />
+        <path class="cls-1"
+            d="m10.28,17.05c-.08.63.34,1.22.97,1.32.08.01.16.02.23.02.39-.02.74-.22.95-.54.08-.13.14-.27.16-.44l-2.28-.39s-.03,0-.03.02Z" />
+        <path class="cls-1"
+            d="m8.64,6.45l.79.79c.09-.02.17-.03.26-.03.28,0,.5-.22.5-.5s-.22-.5-.5-.5c-.38,0-.74.09-1.06.24Z" />
+        <path class="cls-1"
+            d="m15.65,13.47l.15-.86c.3-1.77-.39-3.41-1.96-4.09-.01,0-.02-.02-.02-.03l.05-.31c.08-.44-.16-.91-.59-1.05-.52-.16-1.05.17-1.14.69l-.07.39c-.48.03-.92.17-1.31.37l4.88,4.88Z" />
+        <path class="cls-1"
+            d="m9.96,9.18h0l-.71-.71-2.15-2.15-.73-.73h0l-.71-.71-2.42-2.42-.71.71,2.54,2.54c-.4.71-.65,1.51-.65,2.38,0,.28.22.5.5.5s.5-.22.5-.5c0-.59.14-1.14.38-1.64l1.5,1.5c-.09.26-.15.54-.15.83s.22.5.5.5.48-.21.5-.48l1.22,1.22c-.23.42-.41.9-.5,1.42l-.49,2.88s0,.01-.01.02l-1.33.95s0,.01-.01.02l-.1.57,9.25,1.57.09-.53,2.48,2.48.71-.71-2-2-7.49-7.49Z" />
+        <path class="cls-1"
+            d="m7.1,4.92c.62-.44,1.36-.71,2.18-.71.28,0,.5-.22.5-.5s-.22-.5-.5-.5c-1.09,0-2.09.37-2.9.98l.72.72Z" />
+    </g>
+</svg>
\ No newline at end of file

Seilassist/Sailassist/Assets.xcassets/IconImage/Chat/chat_alert_none.imageset/chat_alert_none_1.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="_レイヤー_2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" fill="#38383c">
+    <defs>
+        <style>.cls-1,.cls-2{stroke-width:0px;}.cls-2{fill:none;opacity:.1;}</style>
+    </defs>
+    <g id="_レイヤー_1-2">
+        <rect class="cls-2" width="22" height="22" />
+        <path class="cls-1"
+            d="m10.28,17.05c-.08.63.34,1.22.97,1.32.08.01.16.02.23.02.39-.02.74-.22.95-.54.08-.13.14-.27.16-.44l-2.28-.39s-.03,0-.03.02Z" />
+        <path class="cls-1"
+            d="m8.64,6.45l.79.79c.09-.02.17-.03.26-.03.28,0,.5-.22.5-.5s-.22-.5-.5-.5c-.38,0-.74.09-1.06.24Z" />
+        <path class="cls-1"
+            d="m15.65,13.47l.15-.86c.3-1.77-.39-3.41-1.96-4.09-.01,0-.02-.02-.02-.03l.05-.31c.08-.44-.16-.91-.59-1.05-.52-.16-1.05.17-1.14.69l-.07.39c-.48.03-.92.17-1.31.37l4.88,4.88Z" />
+        <path class="cls-1"
+            d="m9.96,9.18h0l-.71-.71-2.15-2.15-.73-.73h0l-.71-.71-2.42-2.42-.71.71,2.54,2.54c-.4.71-.65,1.51-.65,2.38,0,.28.22.5.5.5s.5-.22.5-.5c0-.59.14-1.14.38-1.64l1.5,1.5c-.09.26-.15.54-.15.83s.22.5.5.5.48-.21.5-.48l1.22,1.22c-.23.42-.41.9-.5,1.42l-.49,2.88s0,.01-.01.02l-1.33.95s0,.01-.01.02l-.1.57,9.25,1.57.09-.53,2.48,2.48.71-.71-2-2-7.49-7.49Z" />
+        <path class="cls-1"
+            d="m7.1,4.92c.62-.44,1.36-.71,2.18-.71.28,0,.5-.22.5-.5s-.22-.5-.5-.5c-1.09,0-2.09.37-2.9.98l.72.72Z" />
+    </g>
+</svg>
\ No newline at end of file

Seilassist/Sailassist/Chat/ChatView.swift

@@ -9,15 +9,20 @@ import SwiftUI
 
 struct ChatView: View {
     @State var isEmargency: Bool = false
+    @State var isShowMember: Bool = false
     var body: some View {
         ZStack {
             if isEmargency{
                 LinearGradient(gradient: Gradient(colors: [.chatEmargencyColor1,  .chatEmargencyColor2]), startPoint: .top, endPoint: .bottom)
                     .ignoresSafeArea()
             }
-            VStack{
+            VStack(spacing: 0){
+                ChatTitleView(isShowMember: $isShowMember)
+                
                 ZStack{
                     ScrollView(.vertical) {
+                        Spacer()
+                            .frame(height: 20)
                         OtherChatContentView()
                         
                         MyChatContentView()
@@ -37,6 +42,9 @@ struct ChatView: View {
                             Spacer()
                         }
                     }
+                    if isShowMember{
+                        ChatMemberView()
+                    }
                 }
 
             }

Seilassist/Sailassist/Chat/View/ChatInputView.swift

@@ -16,15 +16,16 @@ struct ChatInputView: View {
             Spacer()
             Divider()
             
-            HStack(spacing: 11){
+            HStack(spacing: 10){
                 TextField("", text: $inputText, onEditingChanged: { isEdit in
                     sceneDelegate.tabWindow?.isHidden = isEdit
                 })
                 .focused($isKeyboard)
+                .font(FontStyle.SupplementText.font)
                 .foregroundColor(ColorSet.BodyChat.color)
                 .padding(10)
                 .background(ColorSet.ChatForm.color)
-                .cornerRadius(10)
+                .cornerRadius(5)
                 .padding(.vertical, 10)
                 .padding(.leading, 20)
                 
@@ -40,7 +41,7 @@ struct ChatInputView: View {
                 .padding(.vertical, 6)
                 .padding(.trailing, 11)
             }
-            .background(ColorSet.BackgroundPrimary.color)
+            .background(ColorSet.BackgroundSecondary.color)
         }
         
     }

Seilassist/Sailassist/Chat/View/ChatMemberView.swift

+//
+//  ChatMemberView.swift
+//  Sailassist
+//
+//  Created by Mamoru Sugita on 2023/11/10.
+//
+
+import SwiftUI
+
+struct ChatMemberView: View {
+    var members = ["Yokoyama", "Nogami", "Arahira", "Enokido"]
+    var body: some View {
+        VStack {
+            List {
+                ForEach(members, id: \.self) { member in
+                    Text(member)
+                        .foregroundColor(ColorSet.BodyChat.color)
+                        .font(FontStyle.SupplementText.font)
+                }
+                .listRowBackground(ColorSet.ModalWindowFront.color)
+                .listRowSeparatorTint(ColorSet.LineModal.color)
+            }
+            .scrollDisabled(true)
+            .scrollContentBackground(.hidden)
+            .background(ColorSet.ModalWindowBack.color)
+            
+            Spacer()
+        }
+    }
+}
+
+#Preview {
+    ChatMemberView()
+}

Seilassist/Sailassist/Chat/View/ChatTitleView.swift

+//
+//  ChatTitleView.swift
+//  Sailassist
+//
+//  Created by Mamoru Sugita on 2023/11/09.
+//
+
+import SwiftUI
+
+struct ChatTitleView: View {
+    @Binding var isShowMember: Bool
+    var body: some View {
+        
+        VStack {
+            
+            HStack {
+                Button{
+                    
+                }label: {
+//                    Image("ink_02")
+                }
+                .disabled(true)
+                .frame(width: 48, height: 48)
+                
+                Spacer()
+                HStack(spacing: 8) {
+                    VStack{
+                        Text("JMB-Demo(0518)")
+                            .font(FontStyle.TitleL.font)
+                        Text("Yokoyama,Nogami,Arahira,Enokida")
+                            .font(FontStyle.TitleSBold.font)
+                        
+                    }
+                    .foregroundColor(ColorSet.Body.color)
+                    .frame(width: 162,height: 44)
+                    
+                    
+                    Button{
+                        isShowMember.toggle()
+                    }label: {
+                        Image(systemName: isShowMember ? "chevron.down" : "chevron.up")
+                            .resizable()
+                            .scaledToFit()
+                            .frame(width: 22.63, height: 12.73)
+                            .foregroundColor(ColorSet.Body.color)
+                        
+                    }
+                    .frame(width: 30, height: 30)
+                }
+                
+                Spacer()
+
+                Button{
+                    
+                }label: {
+                    Image("chat_alert")
+                        .resizable()
+                        .scaledToFit()
+                        .frame(width: 30, height: 30)
+                }
+                .frame(width: 48, height: 48)
+            }
+            
+            Divider()
+                .background(ColorSet.LineColor04.color)
+        }
+    }
+}
+
+#Preview {
+    ChatTitleView(isShowMember: .constant(false))
+}

Seilassist/Sailassist/Chat/View/MyChatContentView.swift

@@ -19,17 +19,20 @@ struct MyChatContentView: View {
                     .background(ColorSet.ChatBaloon.color)
                     .cornerRadius(10, corners: [.tl, .tr, .bl])
                 
-                HStack(spacing: 8){
+                HStack(spacing: 0){
                     Text("yyyy/MM/dd hh:mm")
-                        .font(FontStyle.DateText.font)
-                        .foregroundColor(ColorSet.ChatDate.color)
+                        .padding(.trailing, 8)
                     
                     Image(systemName: "eye.fill")
                         .resizable()
                         .scaledToFit()
                         .frame(width: 17, height: 17)
-
+                        .padding(.trailing, 4)
+                    
+                    Text("1")
                 }
+                .font(FontStyle.DateText.font)
+                .foregroundColor(ColorSet.BodyDescriptiion.color)
             }
             .padding(.trailing, 20)
         }

Seilassist/Sailassist/Chat/View/OtherChatContentView.swift

@@ -10,22 +10,26 @@ import SwiftUI
 struct OtherChatContentView: View {
     var body: some View {
         HStack {
-            VStack(alignment: .leading, spacing: 10) {
-                Text("テキストメッセージテキストメッセージテキストメッセージテキストメッセージテキストメッセージテキストメッセージ")
-                    .font(FontStyle.DefaultText.font)
-                    .foregroundColor(ColorSet.BodyChat.color)
-                    .padding(15)
-                    .background(ColorSet.ChatBaloon.color)
-                    .cornerRadius(10, corners: [.tl, .tr, .br])
-                
-                HStack(alignment: .top){
-                    Text("yyyy/MM/dd hh:mm")
-                        .font(FontStyle.DateText.font)
-                        .foregroundColor(ColorSet.ChatDate.color)
+            VStack(alignment: .leading, spacing: 4) {
+                Text("Taro")
+                    .font(FontStyle.EmphasisText.font)
+                    .foregroundColor(ColorSet.Body.color)
+                VStack(alignment: .leading, spacing: 10) {
+                    Text("テキストメッセージテキストメッセージテキストメッセージテキストメッセージテキストメッセージテキストメッセージ")
+                        .font(FontStyle.DefaultText.font)
+                        .foregroundColor(ColorSet.BodyChat.color)
+                        .padding(15)
+                        .background(ColorSet.ChatBaloon.color)
+                        .cornerRadius(10, corners: [.tl, .tr, .br])
+                    
+                    HStack(alignment: .top){
+                        Text("yyyy/MM/dd hh:mm")
+                            .font(FontStyle.DateText.font)
+                            .foregroundColor(ColorSet.ChatDate.color)
+                    }
                 }
             }
             .padding(.leading, 20)
-            
             Spacer()
         }
         .padding(.trailing, 80)

Seilassist/Sailassist/Constants/ColorSet.swift

@@ -130,6 +130,10 @@ enum ColorSet: String, CaseIterable{
     case LineColor02
     /// Line - Line 03
     case LineColor03
+    /// Line - Line 04
+    case LineColor04
+    /// Line - Line Modal
+    case LineModal
 
     // MARK: Notice Color
     /// Notice - Notice
@@ -261,6 +265,10 @@ extension ColorSet{
             "LineColor02"
         case .LineColor03:
             "LineColor03"
+        case .LineColor04:
+            "LineColor04"
+        case .LineModal:
+            "LineModalColor"
         case .Notice:
             "NoticeColor"
         }

Seilassist/Sailassist/Tab/View/NavigationTitleView.swift

-//
-//  NavigationTitleView.swift
-//  Sailassist
-//
-//  Created by Mamoru Sugita on 2023/11/09.
-//
-
-import SwiftUI
-
-struct NavigationTitleView: View {
-    var body: some View {
-        
-        VStack {
-            HStack {
-                Text(/*@START_MENU_TOKEN@*/"Hello, World!"/*@END_MENU_TOKEN@*/)
-            }
-            
-            Divider()
-            
-            Spacer()
-        }
-    }
-}
-
-#Preview {
-    NavigationTitleView()
-}