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.

Sign up for GitHub

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

[feat/lock_UI_design]: LockScreen 변경된 UI로 수정 #169

Merged
merged 3 commits into from
Mar 30, 2024
Merged

[feat/lock_UI_design]: LockScreen 변경된 UI로 수정 #169

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
4fcffd1
[refact]: LockScreen 디자인 수정
kangyuri1114 Mar 15, 2024
4a32d7c
[feat]: 세로모드만 허용
kangyuri1114 Mar 15, 2024
fe86aa0
[feat]: UI 수정 완료
kangyuri1114 Mar 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion feature/lock/src/main/AndroidManifest.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@
<activity
android:name=".LockActivity"
android:exported="false"
android:theme="@style/Base.Theme.HMH" />
android:theme="@style/Base.Theme.HMH"
android:screenOrientation="portrait" />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이렇게 되면 모든 화면이 가로모드 차단되는 건가요??

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

가로모드 차단이라기 보다는 세로모드로만 설정한겁니다! 그리고 모든 화면은 아니고 해당 액티비티 안에 속성을 넣은거라 해당 액티비티 뷰만 세로모드가 됩니다~!

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

그래서 어떤 화면들을 세로모드만 가져갈지에 대해서 논의가 필요할 것 같다고 한 거예요


<service
android:name="com.hmh.hamyeonham.core.service.LockAccessibilityService"
Expand Down
84 changes: 38 additions & 46 deletions feature/lock/src/main/java/com/hmh/hamyeonham/feature/lock/LockActivity.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,32 +11,34 @@ import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.AsyncImage
import com.hmh.hamyeonham.common.context.getAppNameFromPackageName
import com.hmh.hamyeonham.common.context.toast
import com.hmh.hamyeonham.common.navigation.NavigationProvider
import com.hmh.hamyeonham.feature.lock.ui.theme.Blackground
import com.hmh.hamyeonham.feature.lock.ui.theme.BluePurpleButton
import com.hmh.hamyeonham.feature.lock.ui.theme.Gray1
import com.hmh.hamyeonham.feature.lock.ui.theme.Gray2
import com.hmh.hamyeonham.feature.lock.ui.theme.Gray3
import com.hmh.hamyeonham.feature.lock.ui.theme.HMHAndroidTheme
import com.hmh.hamyeonham.feature.lock.ui.theme.HmhTypography
import com.hmh.hamyeonham.feature.lock.ui.theme.WhiteBtn
import com.hmh.hamyeonham.feature.lock.ui.theme.WhiteText
import dagger.hilt.android.AndroidEntryPoint
import javax.inject.Inject
Expand All @@ -55,7 +57,7 @@ class LockActivity : ComponentActivity() {
onClickClose = {
killAppByPackageName(
context = this,
packageName = packageName
packageName = packageName,
)
finish()
},
Expand All @@ -66,7 +68,7 @@ class LockActivity : ComponentActivity() {
addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)
}.let(::startActivity)
finish()
}
},
)
}
}
Expand All @@ -85,7 +87,6 @@ class LockActivity : ComponentActivity() {
}
}


@Composable
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

컴포즈에서는 ui선언 함수와 로직 선언 함수를 한 파일에 작성하나요?? 아니라면 파일을 분리해서 책임을 분리하는 게 깔끔할 것 같은데 (컴포즈가 원래 그런거라면 어쩔 수 없고욤)

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

뷰모델과 관련없는 로직이라면
ui선언 함수와 로직 관련 코드를 한 파일에 작성하는 것이 맞는 걸로 알고 있어요!
activity+xml 느낌으루다가..? 근데 저도 정확히 맞는지는 모르겠네용
@KwakEuiJin 답변부타케

fun LockScreen(
packageName: String,
Expand All @@ -95,72 +96,71 @@ fun LockScreen(
Box(
modifier = Modifier
.fillMaxSize()
.background(Blackground)
.background(Blackground),
) {
val context = LocalContext.current
val appName = context.getAppNameFromPackageName(packageName)
val appIcon = context.packageManager.getApplicationIcon(packageName)

Column(
modifier = Modifier
.align(Alignment.Center)
.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally
.align(Alignment.TopCenter)
.fillMaxWidth()
.padding(top = 132.dp),
horizontalAlignment = Alignment.CenterHorizontally,
) {
AsyncImage(
model = appIcon,
contentDescription = "App Image"
model = R.drawable.lock_on,
contentDescription = "LockScreen Icon",
modifier = Modifier.padding(bottom = 48.dp).size(120.dp),
)
Spacer(modifier = Modifier.height(44.dp))
Text(
text = stringResource(R.string.target_usage_time_end),
fontSize = 20.sp,
style = TextStyle(
fontSize = 20.sp,
lineHeight = 30.sp,
fontWeight = FontWeight(600),
color = Color(0xFFDBDAE7),
)
style = HmhTypography.headlineMedium,
color = WhiteText,
)
Spacer(modifier = Modifier.height(5.dp))
Text(
stringResource(R.string.use_it_anymore, appName),
style = TextStyle(
fontSize = 14.sp,
lineHeight = 21.sp,
fontWeight = FontWeight(400),
color = Color(0xFF8D8D9F),
)
color = Gray2,
style = TextStyle(textAlign = TextAlign.Center).merge(HmhTypography.bodyMedium),
modifier = Modifier.padding(vertical = 10.dp),
Comment on lines +124 to +125
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

오 컴포즈는 이런 식으로 하는군요

)
}

Column(
modifier = Modifier
.align(Alignment.BottomCenter)
.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally
horizontalAlignment = Alignment.CenterHorizontally,
) {
Text(
stringResource(R.string.remind_alarm_permission),
style = TextStyle(textAlign = TextAlign.Center).merge(HmhTypography.bodySmall),
color = Gray3,
modifier = Modifier.padding(vertical = 21.dp).align(Alignment.CenterHorizontally),
)
Button(
colors = ButtonDefaults.buttonColors(containerColor = Color(0xFF3D17D3)),
colors = ButtonDefaults.buttonColors(containerColor = BluePurpleButton),
onClick = {
onClickClose()
},
shape = RoundedCornerShape(4.dp),
modifier = Modifier.padding(vertical = 14.dp),
) {
Text(
text = stringResource(R.string.close),
modifier = Modifier
.padding(horizontal = 70.dp, vertical = 10.dp),
style = HmhTypography.titleMedium
style = HmhTypography.titleMedium,
color = WhiteBtn,
)
}
Spacer(modifier = Modifier.height(14.dp))
Text(
modifier = Modifier.clickable(onClick = onClickUnLock),
modifier = Modifier.clickable(onClick = onClickUnLock)
.padding(top = 22.dp, bottom = 58.dp),
text = stringResource(R.string.do_unlock),
style = HmhTypography.titleSmall,
color = WhiteText
color = Gray1,
)
Spacer(modifier = Modifier.height(38.dp))
}
}
}
Expand All @@ -175,11 +175,3 @@ fun killAppByPackageName(context: Context, packageName: String) {
Log.e("LockActivity", "killAppByPackageName error : $e")
}
}

@Preview(showBackground = true)
@Composable
fun GreetingPreview() {
HMHAndroidTheme {
LockScreen("HHM")
}
}
Comment on lines -178 to -185
Copy link
Collaborator

@jihyun0v0 jihyun0v0 Mar 20, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 부분은 왜 지운 건가요??

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이건 Preview라고 컴포즈에서 디자인한 화면을 빌드 전에 미리 보는 코드인데 저는 미리 볼 필요없어서 지웠어요~
프리뷰 빌드 넘 오래 걸려서..

127 changes: 127 additions & 0 deletions feature/lock/src/main/res/drawable/lock_on.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,127 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="120dp"
android:height="120dp"
android:viewportWidth="120"
android:viewportHeight="120">
<path
android:pathData="M86.4,117.86H33.18L15.01,98.41V44.07H104.57V98.41L86.4,117.86Z"
android:fillColor="#3427EE"/>
<path
android:pathData="M86.4,117.86H33.18C26.09,110.26 22.11,106 15.01,98.41V44.07L33.18,41.8H86.4L104.57,44.07V98.41C97.48,106 93.5,110.25 86.4,117.85V117.86Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="59.79"
android:startY="41.8"
android:endX="59.79"
android:endY="117.86"
android:type="linear">
<item android:offset="0" android:color="#FF3D17D3"/>
<item android:offset="1" android:color="#FF5C8DFF"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M64.71,66.87H54.87V92.8H64.71V66.87Z"
android:fillColor="#17171B"/>
<path
android:pathData="M86.39,41.8H33.18L15.01,44.07L33.18,46.35H86.4L104.57,44.07L86.39,41.8Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="15.01"
android:startY="44.07"
android:endX="104.57"
android:endY="44.07"
android:type="linear">
<item android:offset="0" android:color="#FFFFCDDD"/>
<item android:offset="0.9" android:color="#00FFCDDD"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M74.05,2.15H45.53L27.61,20.07V43.68L30.76,44.15H41.26V25.72L51.18,15.8H68.4L78.32,25.72V44.15H88.82L91.97,43.68V20.07L74.05,2.15Z"
android:fillColor="#3D17D3"/>
<path
android:pathData="M27.61,20.07L30.76,21.37L46.84,5.3L45.53,2.15L27.61,20.07Z"
android:fillColor="#DFDFF1"/>
<path
android:pathData="M45.53,2.15L46.84,5.3H72.75L74.05,2.15H45.53Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="45.53"
android:startY="3.72"
android:endX="74.05"
android:endY="3.72"
android:type="linear">
<item android:offset="0" android:color="#FFFFCDDD"/>
<item android:offset="0.9" android:color="#00FFCDDD"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M27.61,43.68L30.76,44.15V21.37L27.61,20.07V43.68Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="22.62"
android:startY="38.69"
android:endX="35.34"
android:endY="25.95"
android:type="linear">
<item android:offset="0.1" android:color="#00FFCDDD"/>
<item android:offset="1" android:color="#FFFFCDDD"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M33.18,117.86V46.35L15.01,44.07V98.41L33.18,117.86Z"
android:fillColor="#5C8DFF"/>
<path
android:pathData="M86.4,117.86V46.35L104.57,44.07V98.41L86.4,117.86Z"
android:fillColor="#2C16A3"/>
<path
android:pathData="M33.18,117.86V46.35L15.01,44.07V98.41L33.18,117.86Z">
<aapt:attr name="android:fillColor">
<gradient
android:startX="10.19"
android:startY="94.86"
android:endX="45.95"
android:endY="59.11"
android:type="linear">
<item android:offset="0.1" android:color="#003D17D3"/>
<item android:offset="1" android:color="#FF3D17D3"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M78.32,25.72L80.6,24.64V44.15H78.32V25.72Z"
android:strokeAlpha="0.3"
android:fillAlpha="0.3">
<aapt:attr name="android:fillColor">
<gradient
android:startX="79.46"
android:startY="24.64"
android:endX="79.46"
android:endY="44.15"
android:type="linear">
<item android:offset="0" android:color="#FFFFCDDD"/>
<item android:offset="0.9" android:color="#00FFCDDD"/>
</gradient>
</aapt:attr>
</path>
<path
android:pathData="M33.18,117.86V46.35L15.01,44.07V98.41L33.18,117.86Z"
android:strokeAlpha="0.3"
android:fillAlpha="0.3">
<aapt:attr name="android:fillColor">
<gradient
android:startX="10.19"
android:startY="94.86"
android:endX="45.95"
android:endY="59.11"
android:type="linear">
<item android:offset="0" android:color="#FFFFCDDD"/>
<item android:offset="0.9" android:color="#00FFCDDD"/>
</gradient>
</aapt:attr>
</path>
</vector>
3 changes: 2 additions & 1 deletion feature/lock/src/main/res/values/strings.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,5 +3,6 @@
<string name="use_it_anymore">이제 %s을(를)\n"사용할 수 없어요"</string>
<string name="close">닫기</string>
<string name="do_unlock">잠금 해제하기</string>
<string name="app_kill_fail">앱을 종료하는데 실패했습니다.</string>
<string name="app_kill_fail">앱을 종료하는 데 실패했습니다.</string>
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

인간 맞춤법 검사기 강유리 짱짱

<string name="remind_alarm_permission">*알림이 오지 않는다면\n설정에서 푸시 알림 권한을 허용해 주세요</string>
</resources>
Loading