कॉल में होने की स्थिति

  • होस्ट की गतिविधि: InCallActivity
  • रूट लेआउट: @layout/in_call_activity

इनकमिंग कॉल स्क्रीन

फ़्रैगमेंट. IncomingCallFragment

लैंडस्केप मोड में, कॉल के दौरान डायलपैड की स्क्रीन

लेआउट: @layout/ongoing_call_fragment

इनकमिंग कॉल स्क्रीन

पहली इमेज. इनकमिंग कॉल स्क्रीन

Component [id:]ClassName प्रॉपर्टी वैल्यू
background_image:
BackgroundImageView		 @config/config_background_image_alpha 1.0
इसका इस्तेमाल, प्रोग्राम के ज़रिए संपर्क अवतार के लिए किया जाता है.
@config/config_background_image_error_alpha 1.0
प्रोग्राम के हिसाब से, संपर्क पत्र की टाइल के लिए इस्तेमाल किया जाता है. 0.0 पर सेट करने पर, बैकग्राउंड का रंग नहीं दिखेगा.
user_profile_container:
@layout/user_profile_large		 लागू नहीं लागू नहीं
ringing_call_controller_bar:
RingingCallControllerBarFragment		 height @dimen/in_call_controller_bar_height
layout_margintStart
layout_marginEnd
layout_marginBottom		 @dimen/in_call_controller_bar_margin
  • उपयोगकर्ता की प्रोफ़ाइल. @layout/user_profile_large
    Component [id:]ClassName प्रॉपर्टी वैल्यू
    root: LinearLayout orientation horizontal
    paddingStart
    paddingEnd    		 @dimen/in_call_user_profile_margin
    user_profile_avatar: ImageView width in_call_avatar_icon_size
    height in_call_avatar_icon_size
    scaleType fitCenter
    User info: LinearLayout paddingStart @dimen/in_call_margin_between_avatar_and_text
    user_profile_title:TextView textAppearance @style/TextAppearance.InCallUserTitle
    user_profile_phone_number: TextView textAppearance @style/TextAppearance.InCallUserPhoneNumber
    marginTop @dimen/in_call_phone_number_margin_top
    user_profile_call_state: Chronometer textAppearance @style/TextAppearance.InCallState
    marginTop @dimen/in_call_state_margin_top
  • RingingCallControllerBarFragment. @layout/ringing_call_controller_bar_fragment
    Component [id:]ClassName प्रॉपर्टी वैल्यू
    root: ConstraintLayout height @dimen/in_call_controller_bar_height
    background @android:color/transparent
    answer_call_button: ImageView width
    height    		 @dimen/ringing_call_button_touch_target_size
    background @drawable/dialer_ripple_background
    src @drawable/ic_phone
    tint @color/phone_call
    scaleType center
    answer_call_text: TextView marginStart @dimen/ringing_call_text_margin
    text @string/answer_call
    textAppearance ?android:attr/textAppearanceLarge
    end_call_button: ImageView width
    height    		 @dimen/ringing_call_button_touch_target_size
    background @drawable/dialer_ripple_background
    src @drawable/ic_call_end
    tint @color/phone_end_call
    scaleType center
    end_call_text: TextView marginStart @dimen/ringing_call_text_margin
    text @string/decline_call
    textAppearance ?android:attr/textAppearanceLarge
    mid_line: Guideline constraintGuide_percent 0.5

पोर्ट्रेट मोड में आने वाला कॉल

पोर्ट्रेट मोड में आने वाले कॉल का पेज, लैंडस्केप मोड के पेज के @layout/ongoing_call_fragment के साथ एक ही होता है. हालांकि, @layout[-port]/user_profile_large के लिए अलग से डिज़ाइन किया गया है.

पोर्ट्रेट मोड में आने वाले कॉल का पेज

दूसरी इमेज. पोर्ट्रेट मोड में आने वाला कॉल

  • उपयोगकर्ता की प्रोफ़ाइल. @layout/user_profile_large
    Component [id:]ClassName प्रॉपर्टी वैल्यू
    root: LinearLayout orientation vertical
    gravity center
    user_profile_avatar: ImageView width in_call_avatar_icon_size
    height in_call_avatar_icon_size
    scaleType fitCenter
    user_profile_title: TextView textAppearance @style/TextAppearance.InCallUserTitle
    paddingTop @dimen/in_call_margin_between_avatar_and_text
    user_profile_phone_number: TextView textAppearance @style/TextAppearance.InCallUserPhoneNumber
    paddingTop @dimen/in_call_phone_number_margin_top
    user_profile_call_state: Chronometer textAppearance @style/TextAppearance.InCallState
    paddingTop @dimen/in_call_state_margin_top

मौजूदा कॉल का पेज

फ़्रैगमेंट. OngoingCallFragment

लैंडस्केप मोड

लैंडस्केप मोड में चल रहे कॉल की स्क्रीन

तीसरा चित्र. लैंडस्केप मोड में चल रहे कॉल की स्क्रीन

Component [id:]ClassName प्रॉपर्टी वैल्यू
background_image: BackgroundImageView @config/config_background_image_alpha 1.0
इसका इस्तेमाल, प्रोग्राम के ज़रिए संपर्क अवतार के लिए किया जाता है.
@config/config_background_image_error_alpha 1.0
प्रोग्राम के हिसाब से, संपर्क पत्र की टाइल के लिए इस्तेमाल किया जाता है. 0.0 पर सेट करने पर, बैकग्राउंड का रंग छिप जाता है.
अन्य व्यू का कंटेनर: ConstraintLayout background @android:color/transparent
कंट्रोल बार के बटनों के लिए, रिपल इफ़ेक्ट को काम करने के लिए ज़रूरी है.
incall_dialpad_fragment: InCallDialpadFragment लागू नहीं कॉल के दौरान डायलपैड देखें
user_profile_container: @layout/user_profile_large लागू नहीं यह @layout/user_profile_large के इनकमिंग कॉल पेज पर मौजूद बटन जैसा ही है.
  • लैंडस्केप मोड
  • पोर्ट्रेट मोड
onhold_user_profile: OnHoldCallUserProfileFragment height @dimen/onhold_user_info_height
layout_marginTop @dimen/onhold_profile_margin_y
layout_marginStart
layout_marginEnd		 @dimen/onhold_profile_margin_x
ongoing_call_control_bar: OnGoingCallControllerBarFragment layout_marginBottom @dimen/in_call_controller_bar_margin
layout_marginHorizontal @dimen/in_call_controller_bar_margin
  • OnHoldCallUserProfileFragment. @layout/onhold_user_profile
    कॉम्पोनेंट [id:]ClassName प्रॉपर्टी वैल्यू
    root: CardView android:elevation @dimen/dialer_card_elevation
    cardBackgroundColor @color/onhold_call_background
    cardCornerRadius @dimen/onhold_profile_corner_radius
    swap_calls_view: ConstraintLayout background ?android:attr/selectableItemBackground
    guideline: Guideline layout_constraintGuide_begin @dimen/onhold_profile_guideline
    icon: ImageView width
    height    		 @dimen/avatar_icon_size
    scaleType centerCrop
    layout_marginStart @dimen/onhold_profile_avatar_margin
    title: TextView textAppearance ?android:attr/textAppearanceLarge
    text: TextView text @string/onhold_call_label
    textAppearance ?android:attr/textAppearanceSmall
    swap_call_button: ImageView src @drawable/ic_swap_calls
    tint @color/secondary_icon_color
    scaleType center
    paddingLeft
    paddingRight    		 @dimen/swap_call_button_margin
  • OnGoingCallControllerBarFragment. @layout/on_going_call_controller_bar_fragment
    Component [id:]ClassName प्रॉपर्टी वैल्यू
    root: ConstraintLayout height @dimen/in_call_controller_bar_height
    mute_button: ImageView width
    height    		 @dimen/in_call_button_size
    scaleType center
    src @drawable/ic_mute_activatable
    background @drawable/dialer_ripple_background
    toggle_dialpad_button: ImageView width
    height    		 @dimen/in_call_button_size
    scaleType center
    src @drawable/ic_dialpad_activatable
    background @drawable/dialer_ripple_background
    end_call_button: ImageView style @style/DialpadPrimaryButton
    src @drawable/ic_call_end_button
    voice_channel_view: LinearLayout orientation vertical
    voice_channel_button: ImageView width
    height    		 @dimen/in_call_button_size
    scaleType center
    src @drawable/ic_audio_route_vehicle_activatable
    background @drawable/dialer_ripple_background
    voice_channel_text: TextView visibility gone
    pause_button: ImageView width
    height    		 @dimen/in_call_button_size
    scaleType center
    src @drawable/ic_pause_activatable
    background @drawable/dialer_ripple_background

पोर्ट्रेट मोड में मौजूदा कॉल का पेज

चौथी इमेज. पोर्ट्रेट मोड में, चल रहे कॉल का पेज

पोर्ट्रेट मोड में भी वही लेआउट होता है. हालांकि, @layout/user_profile_large को अलग तरीके से लेआउट किया जाता है. इनकमिंग कॉल वाले पेज पर, पोर्ट्रेट मोड भी देखें.

कॉल के दौरान डायलपैड

फ़्रैगमेंट. InCallDialpadFragment

लैंडस्केप मोड

लेआउट. @layout/incall_dialpad_fragment

लैंडस्केप मोड में, कॉल के दौरान डायलपैड की स्क्रीन

पांचवां चित्र. लैंडस्केप मोड में, कॉल के दौरान डायलपैड की स्क्रीन

Component [id:]ClassName प्रॉपर्टी वैल्यू
divider: Guideline layout_constraintGuide_percent 0.5
dialpad_fragment: KeypadFragment लागू नहीं कीपैड देखें
dialpad_info_boundaries: View height dialpad_fragment के बराबर किराया
layout_constraintDimensionRatio W, 1:1
call_state: Chronometer layout_width match_parent, ताकि टेक्स्ट अपडेट होने पर पूरे व्यू को फिर से न खींचा जाए
textAppearance @style/TextAppearance.InCallState
marginBottom @dimen/call_state_padding
title: TextView textAppearance @style/TextAppearance.DialNumber

पोर्ट्रेट मोड में इनकॉल डायलपैड

लेआउट. @layout[-port]/incall_dialpad_fragment

पोर्ट्रेट मोड में, कॉल के दौरान डायलपैड की स्क्रीन

छठी इमेज. पोर्ट्रेट मोड में, कॉल के दौरान डायलपैड की स्क्रीन

Component [id:]ClassName प्रॉपर्टी वैल्यू
dialpad_fragment: KeypadFragment layout_marginTop @dimen/keypad_margin
call_state: Chronometer layout_width match_parent का इस्तेमाल करें, ताकि टेक्स्ट अपडेट होने पर पूरे व्यू को फिर से न खींचा जाए.
gravity center
textAppearance @style/TextAppearance.InCallState
marginStart
marginEnd		 @dimen/dialpad_info_edge_padding_size
title: TextView gravity डायल किए गए नंबर को बीच में दिखाने और शुरू होने पर फ़ेड करने के लिए, चौड़ाई को wrap_content पर सेट करें.
textAppearance @style/TextAppearance.DialNumber
marginStart
marginEnd		 @dimen/dialpad_info_edge_padding_size

KeypadFragment. कीपैड देखें