HTML에서 대화 상자 배경을 사용자 정의하는 방법은 무엇입니까? 대화 상자를 사용자 정의하는 방법을 알려주는 기사가 있습니다!

이 글에서는 주로 HTML에서 대화 상자 태그를 사용자 정의하는 방법과 기타 스타일 설정에 대한 배경을 설명합니다. 코드가 많고 이해가 필요합니다. 다음으로 HTML 대화 상자 사용자 정의를 살펴보겠습니다. 기사를 작성해 봅시다

이제 기사의 첫 번째 질문인 HTML에서 대화 상자 태그의 배경을 사용자 정의하는 방법을 구현해 보겠습니다.

요즘에는 많은 앱 프롬프트 대화 상자가 매우 개인화되어 있지만 여전히 시스템의 대화상자 스타일이 너무 뒤떨어진다고 생각하시나요? 오늘은 자신만의 대화상자를 맞춤설정하는 방법을 알려드리겠습니다. 학습한 후 앱 테마에 따라 해당 대화상자 스타일을 디자인해 보세요.

좋아, 이제 간단한 스타일의 사용자 정의 대화 상자를 사용하여 사용자 정의 대화 상자의 일반적인 단계와 원리에 대해 이야기하겠습니다.

1단계: 테두리가 없고 완전히 투명한 배경을 사용하여 대화 상자에 대한 스타일 테마 설정(기본적으로 이 테마 사용):

<!--自定义dialog背景全透明无边框theme -->  
<style name="MyDialog" parent="android:style/Theme.Dialog">  
<!--背景颜色及和透明程度-->  
<item name="android:windowBackground">@android:color/transparent</item>  
</style>

대화 상자의 사용자 정의 배경 프레임은 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:android="http://schemas.android.com/apk/res/android">  
    <solid android:color="#ffffff" />  
    <stroke  
        android:width="0.8dp"  
        android:color="#ffffff" />  
    <!-- 圆角 -->  
    <corners android:radius="6dp" />  
</shape>

위는 APP 대화 상자 배경을 사용자 정의하는 간단한 과정은 여기에서 확인하세요. 자세한 내용은 PHP 중국어 웹사이트를 참조하세요.

이제 대화 상자를 사용자 정의하는 방법에 대해 이야기하겠습니다.

많은 일이 있으므로 천천히 시간을 가지세요

<style name="MyDialog" parent="android:style/Theme.Dialog">  
        <!--背景颜色及和透明程度-->  
        <item name="android:windowBackground">@android:color/transparent</item>  
        <!--是否去除标题 -->  
        <item name="android:windowNoTitle">true</item>  
        <!--是否去除边框-->  
        <item name="android:windowFrame">@null</item>  
        <!--是否浮现在activity之上-->  
        <item name="android:windowIsFloating">true</item>  
        <!--是否模糊-->  
        <item name="android:backgroundDimEnabled">false</item>  
</style>

2단계: 사용자 정의 대화 상자에 대한 사용자 정의 xml 인터페이스를 설정합니다. 사용할 수 있습니다. 단일 선택, 다중 선택, 3개 버튼, 4개 버튼 등 다양한 형식의 사용자 정의 XML 제목, 메시지, 확인 버튼과 취소 버튼을 다음과 같이 정의했습니다.

<?xml version="1.0" encoding="utf-8"?>  
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
    android:layout_width="match_parent"  
    android:layout_height="match_parent"  
    android:background="#11ffffff">  
      <LinearLayout  
        android:layout_width="260dp"  
        android:layout_height="wrap_content"  
        android:layout_centerInParent="true"  
        android:background="@drawable/free_dialog_bg"  
        android:orientation="vertical">  
          <TextView  
            android:id="@+id/title"  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:layout_gravity="center"  
            android:layout_margin="15dp"  
            android:gravity="center"  
            android:text="消息提示"  
            android:textColor="#38ADFF"  
            android:textSize="16sp" />  
          <TextView  
            android:id="@+id/message"  
            android:layout_width="wrap_content"  
            android:layout_height="wrap_content"  
            android:layout_marginLeft="20dp"  
            android:layout_marginRight="20dp"  
            android:text="提示消息" />  
        <View  
            android:layout_width="match_parent"  
            android:layout_height="1px"  
            android:layout_marginTop="15dp"  
            android:background="#E4E4E4" />  
<LinearLayout  
            android:layout_width="match_parent"  
            android:layout_height="40dp"  
            android:orientation="horizontal">  
              <Button  
                android:id="@+id/no"  
                android:layout_width="0dp"  
                android:layout_height="match_parent"  
                android:layout_marginLeft="10dp"  
                android:layout_weight="1"  
                android:background="@null"  
                android:gravity="center"  
                android:singleLine="true"  
                android:text="No"  
                android:textColor="#7D7D7D"  
                android:textSize="16sp" />  
              <View  
                android:layout_width="1px"  
                android:layout_height="match_parent"  
                android:background="#E4E4E4" />  
              <Button  
                android:id="@+id/yes"  
                android:layout_width="0dp"  
                android:layout_height="match_parent"  
                android:layout_marginRight="10dp"  
                android:layout_weight="1"  
                android:background="@null"  
                android:gravity="center"  
                android:singleLine="true"  
                android:text="Yes"  
                android:textColor="#38ADFF"  
                android:textSize="16sp" />  
        </LinearLayout>  
    </LinearLayout>  
  </RelativeLayout>

사용자 정의 배경 대화 프레임은 다음과 같습니다.

<?xml version="1.0" encoding="utf-8"?>  
<shape xmlns:android="http://schemas.android.com/apk/res/android">  
    <solid android:color="#ffffff" />  
    <stroke  
        android:width="0.8dp"  
        android:color="#ffffff" />  
    <!-- 圆角 -->  
    <corners android:radius="6dp" />  
</shape>

이 작업은 매우 길지만 학습 과정은 매우 느립니다. 조금씩 해보자

자, 이 글은 여기까지입니다. 궁금한 점이 있으시면 아래로 문의해 주세요.

【에디터 추천】

html5 바닥글 태그는 어떻게 사용하나요? 바닥글 태그 사용 예

html 프레임 태그는 어떻게 사용하나요? 프레임 태그 사용법 소개(예제 포함)

위 내용은 HTML에서 대화 상자 배경을 사용자 정의하는 방법은 무엇입니까? 대화 상자를 사용자 정의하는 방법을 알려주는 기사가 있습니다!의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!