바탕색으로 버튼에 효과적인 소재감
안드로이드 v21 지원 라이브러리를 사용하고 있습니다.
커스텀 배경색으로 버튼을 제작하였습니다.리플, 노출과 같은 재료 설계 효과는 배경색을 사용할 때 사라집니다(클릭 시 고도 제외).
<Button
style="?android:attr/buttonStyleSmall"
android:background="?attr/colorPrimary"
android:textColor="@color/white"
android:textAllCaps="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button1"
/>
다음은 정상 버튼이며 효과는 정상적으로 작동합니다.
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:text="Button1"
/>
사용할때android:background
, 단추의 스타일과 외관, 느낌의 대부분을 빈 색으로 교체하고 있습니다.
업데이트: AppCompat 버전 23.0.0 버전 출시 이후 테마의 스타일을 사용하는 새로운 스타일이 있습니다.colorButtonNormal
장애인분들께는.colorAccent
활성화된 색상을 사용합니다.
이를 통해 직접 버튼에 적용할 수 있습니다.
<Button
...
style="@style/Widget.AppCompat.Button.Colored" />
사용자 정의가 필요한 경우colorButtonNormal
아니면colorAccent
, 당신은 a를 사용할 수 있습니다.ThemeOverlay
이 프로팁에서 설명한 바와 같이android:theme
단추에
이전 답변
다음과 같은 배경에 대해 v21 디렉토리에서 그리기 파일을 사용할 수 있습니다.
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?attr/colorControlHighlight">
<item android:drawable="?attr/colorPrimary"/>
</ripple>
이렇게 하면 배경색이 다음과 같습니다.?attr/colorPrimary
기본 리플 애니메이션을 사용합니다.?attr/colorControlHighlight
(원하는 경우 테마에 설정할 수도 있음).
참고: v21 미만의 사용자 지정 선택기를 만들어야 합니다.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@color/primaryPressed" android:state_pressed="true"/>
<item android:drawable="@color/primaryFocused" android:state_focused="true"/>
<item android:drawable="@color/primary"/>
</selector>
기본, 누름 및 초점 상태에 원하는 색상이 있다고 가정합니다.개인적으로, 저는 선정되는 중간에 리플을 스크린샷으로 찍어 그것에서 주요/집중 상태를 끌어냈습니다.
"소재" 효과를 유지하면서 "평면" 버튼에 대한 사용자 지정 배경을 제공하는 간단한 솔루션이 또 있습니다.
즉:
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/blue">
<Button
style="?android:attr/buttonStyleSmall"
android:background="?android:attr/selectableItemBackground"
android:textColor="@android:color/white"
android:textAllCaps="true"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button1"
/>
</FrameLayout>
Flat 버튼에 사용 가능하며 API >=11에서 작동하며 >=21 기기에 리플 효과를 부여하여 AppCompat 업데이트 시까지 Pre-21의 일반 버튼을 유지하여 리플을 지원합니다.
선택 가능한 기능을 사용할 수도 있습니다.>=21개 버튼에 한해 아이템배경 보더리스.
여기에 사용자 정의 배경과 함께 상승된 버튼에 리플 효과를 전달하는 간단한 하위 호환 방법이 있습니다.
배치는 이렇게 해야 합니다.
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/my_custom_background"
android:foreground="?android:attr/selectableItemBackground"/>
저는 오늘 v22 라이브러리를 가지고 놀다가 이 문제에 부딪혔습니다.
스타일을 사용한다고 가정하면colorButtonNormal
속성과 버튼은 기본적으로 해당 색상을 사용합니다.
<style name="AppTheme" parent="BaseTheme">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/primaryColor</item>
<item name="colorPrimaryDark">@color/primaryColorDark</item>
<item name="colorAccent">@color/accentColor</item>
<item name="colorButtonNormal">@color/primaryColor</item>
</style>
그 외에도 버튼 스타일을 만들 수 있습니다. 여러 가지 색상을 필요로 하는 경우 버튼당 스타일을 사용할 수 있습니다(테스트하지 않고 추측만 했을 뿐입니다).
추가하는 것을 기억하세요.android:
v21 스타일의 항목 이름 앞에 입력할 수 있습니다.
@ianhanniballake의 대답은 완전히 정확하고 간단합니다.하지만 이해하는 데 며칠이 걸렸습니다.그의 대답을 이해하지 못하는 사람을 위해, 여기에 더 자세한 구현 방법이 있습니다.
<Button
android:id="@+id/btn"
style="@style/MaterialButton"
... />
<style name="MaterialButton" parent="Widget.AppCompat.Button.Colored">
<item name="android:theme">@style/Theme.MaterialButton</item>
...
</style>
<style name="Theme.MaterialButton" parent="YourTheme">
<item name="colorAccent">@color/yourAccentColor</item>
<item name="colorButtonNormal">@color/yourButtonNormalColor</item>
</style>
===또는 ===
<Button
android:id="@+id/btn"
style="@style/Widget.AppCompat.Button.Colored"
android:theme="@style/Theme.MaterialButton" />
<style name="Theme.MaterialButton" parent="YourTheme">
<item name="colorAccent">@color/yourAccentColor</item>
<item name="colorButtonNormal">@color/yourButtonNormalColor</item>
</style>
AppCompat(22.1.1+)을 사용하면 다음과 같은 스타일을 추가할 수 있습니다.
<style name="MyGreenButton">
<item name="colorButtonNormal">#009900</item>
</style>
그리고 스타일을 적용해서 사용하면 됩니다.
<android.support.v7.widget.AppCompatButton
style="@style/MyGreenButton"
android:layout_width="match_width"
android:layout_height="wrap_content"
android:text="A Green Button"
/>
프로그램적으로 색상을 변경하면서 (API 15 또는 16에서) 색상을 업데이트할 수 있는 유일한 방법은 '배경 틴트 리스트'를 대신 사용하는 것입니다.그리고 API 21 장치에서 멋진 방사형 애니메이션을 제거하지는 못합니다.
ColorStateList colorStateList = new ColorStateList(new int[][] {{0}}, new int[] {0xFF009900}); // 0xAARRGGBB
button.setSupportBackgroundTintList(colorStateList);
왜냐면button.setBackground(...)
그리고.button.getBackground().mutate().setColorFilter(...)
API 15, 16의 버튼 색상을 API 21의 버튼 색상처럼 변경하지 마십시오.
배경Tint와 전경을 사용했습니다.
<Button
android:layout_width="match_parent"
android:layout_height="40dp"
android:backgroundTint="@color/colorAccent"
android:foreground="?android:attr/selectableItemBackground"
android:textColor="@android:color/white"
android:textSize="10sp"/>
저는 제 배경색을 가질 방법을 찾기 위해 이 게시물에 왔습니다.ListView
항목은 그대로 유지하되 파급력은 유지합니다.
저는 단순히 배경으로 제 색깔을 넣었고 선택 가능한 것을 넣었습니다.항목 전경으로서의 배경:
<style name="my_list_item">
<item name="android:background">@color/white</item>
<item name="android:foreground">?attr/selectableItemBackground</item>
<item name="android:layout_height">@dimen/my_list_item_height</item>
</style>
그리고 매력적으로 작용합니다.단추에도 같은 기술이 사용될 수 있을 것 같습니다.행운을 빌어요 :)
사용하다backgroundTint
대신에background
ImageButton에 관심이 있다면 다음과 같은 간단한 방법을 시도해 볼 수 있습니다.
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@android:drawable/ic_button"
android:background="?attr/selectableItemBackgroundBorderless"
/>
v22.1
appcompat-v7
몇 가지 새로운 가능성을 소개했습니다.이제 하나의 보기에만 특정 테마를 지정할 수 있습니다.
사용하지 않는 app:teme for styling Toolbar.이제 모든 API 레벨 7 이상의 기기에서 안드로이드:테마를 툴바에 사용할 수 있고, API 레벨 11 이상의 기기에서 안드로이드:테마를 모든 위젯에 지원할 수 있습니다.
그래서 글로벌 테마에 원하는 색상을 설정하는 대신 새로운 색상을 만들어 해당 색상에만 할당합니다.Button
예:
<style name="MyColorButton" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorButtonNormal">@color/myColor</item>
</style>
그리고 이 스타일을 당신의 테마로 사용합니다.Button
<Button
style="?android:attr/buttonStyleSmall"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Button1"
android:theme="@style/MyColorButton"/>
타사 라이브러리를 사용해도 괜찮으시다면 traex/Rippl Effect를 확인해 보십시오.몇 줄의 코드만으로 모든 보기에 리플 효과를 추가할 수 있습니다.xml 레이아웃 파일에 리플 효과를 원하는 요소를 랩핑하면 됩니다.com.andexert.library.RippleView
컨테이너.
추가 보너스로 Min SDK 9가 필요하므로 OS 버전 간에 디자인 일관성을 가질 수 있습니다.
라이브러리의 GitHub repo에서 가져온 예는 다음과 같습니다.
<com.andexert.library.RippleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:rv_centered="true">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:src="@android:drawable/ic_menu_edit"
android:background="@android:color/holo_blue_dark"/>
</com.andexert.library.RippleView>
이 특성을 RippleView 요소에 추가하여 리플 색상을 변경할 수 있습니다.app:rv_color="@color/my_fancy_ripple_color
<android.support.v7.widget.AppCompatButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:backgroundTint="#fff"
android:textColor="#000"
android:text="test"/>
사용하다
xmlns:app="http://schemas.android.com/apk/res-auto"
색깔은 lol이팝 전 제품에 적용됩니다.
Alex Lockwood라는 훌륭한 튜토리얼에서 설명한 두 가지 접근법은 다음과 같습니다. http://www.androiddesignpatterns.com/2016/08/coloring-buttons-with-themeoverlays-background-tints.html
Approach #1: 테마오버레이로 버튼의 배경색 수정
<!-- res/values/themes.xml -->
<style name="RedButtonLightTheme" parent="ThemeOverlay.AppCompat.Light">
<item name="colorAccent">@color/googred500</item>
</style>
<Button
style="@style/Widget.AppCompat.Button.Colored"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:theme="@style/RedButtonLightTheme"/>
Approach #2: AppCompat 버튼의 배경 틴트 설정
<!-- res/color/btn_colored_background_tint.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Disabled state. -->
<item android:state_enabled="false"
android:color="?attr/colorButtonNormal"
android:alpha="?android:attr/disabledAlpha"/>
<!-- Enabled state. -->
<item android:color="?attr/colorAccent"/>
</selector>
<android.support.v7.widget.AppCompatButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:backgroundTint="@color/btn_colored_background_tint"/>
프로그래밍 방식으로 색상 적용:
if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.LOLLIPOP) {
ColorStateList colorStateListRipple = new ColorStateList(
new int[][] {{0}},
new int[] {Color.WHITE} // ripple color
);
RippleDrawable rippleDrawable = (RippleDrawable) myButton.getBackground();
rippleDrawable.setColor(colorStateListRipple);
myButton.setBackground(rippleDrawable); // applying the ripple color
}
ColorStateList colorStateList = new ColorStateList(
new int[][]{
new int[]{android.R.attr.state_pressed}, // when pressed
new int[]{android.R.attr.state_enabled}, // normal state color
new int[]{} // normal state color
},
new int[]{
Color.CYAN, // when pressed
Color.RED, // normal state color
Color.RED // normal state color
}
);
ViewCompat.setBackgroundTintList(myButton, colorStateList); // applying the state colors
프로그래밍 방식:
myMaterialButton.setRippleColor(ColorStateList.valueOf(Color.RED));
예를 들어,
MaterialButton myMaterialButton = new MaterialButton(this);
myMaterialButton.setLayoutParams(myButtonParams);
myMaterialButton.setBackgroundColor(Color.GRAY);
myMaterialButton.setRippleColor(ColorStateList.valueOf(Color.RED));
나는 이것을.
android:backgroundTint:"@color/mycolor"
배경 재산을 바꾸는 대신에 말입니다.이것은 재료 효과를 제거하지 못합니다.
언급URL : https://stackoverflow.com/questions/26686250/material-effect-on-button-with-background-color
'programing' 카테고리의 다른 글
판다의 집합 (0) | 2023.10.29 |
---|---|
SQL 데이터베이스에서 데이터를 끌어오려고 할 때 dplyr가 잘못된 테이블 이름을 ON 절에 사용하지 않도록 하는 방법은 무엇입니까? (0) | 2023.10.29 |
왼쪽에서 오른쪽으로 Ionic 리스트 아이템을 스와이프하는 방법? (0) | 2023.10.29 |
파워셸 출력 열폭 (0) | 2023.10.29 |
도커를 루트가 아닌 것으로 복사하려면 어떻게 해야 합니까? (0) | 2023.10.29 |