วิธีสร้าง UIWebView แบบโปร่งใส


117

ฉันมีแอปที่มีUITableViewมุมมองรายละเอียดที่เกี่ยวข้องสำหรับแต่ละแถว ในมุมมองรายละเอียดฉันต้องแสดงข้อความและภาพพื้นหลัง (ข้อความแตกต่างกันในแต่ละแถว แต่ภาพยังคงเหมือนเดิม) วิธีที่ง่ายที่สุดในความคิดของฉันคือการใส่ข้อความในไฟล์ .rtf UIWebViewและแสดงไว้ใน จากนั้นใส่UIImageViewด้านหลังไฟล์UIWebView.

ฉันได้พยายามตั้งค่าUIWebViewความทึบของ IB เป็นศูนย์ แต่ก็ไม่ได้ผล

คุณสามารถช่วยฉันได้ไหม?

คำตอบ:


302

ฉันขอแนะนำ:

webView.opaque = NO;
webView.backgroundColor = [UIColor clearColor];

(การตั้งค่าคุณสมบัติเหล่านี้ใน Interface Builder จะใช้ได้กับ iOS 5.0+ แต่สำหรับ iOS 4.3 คุณต้องตั้งค่า backgroundColor ในโค้ด )

และรวมสิ่งนี้ไว้ในโค้ด HTML ของคุณ:

<body style="background-color: transparent;">

ใช้งานได้กับ iOS 5 เป็นอย่างน้อยในโปรแกรมจำลอง
Jason McCreary

1
ฉันสามารถตั้งค่าความทึบและสีพื้นหลังใน IB ได้ สำหรับฉันแท็กสไตล์คือสิ่งที่ทำให้สิ่งนี้ไม่ทำงาน
devinfoley

วิธีนี้ใช้ได้กับ 4.2.1 หากคุณเขียนสตริงเหล่านี้เป็นโค้ดเท่านั้น หากคุณตั้งค่าตัวเลือกเดียวกันในตัวสร้างหน้าเว็บมากกว่าที่คุณจะไม่ได้รับพื้นหลังโปร่งใส
Gargo

2
<body style="background-color: transparent;">น่าจะเป็นตัวเลือกอย่างน้อยใน iOS เวอร์ชันล่าสุด
zeroimpl

21

ใช้วิธีการเรียกซ้ำด้านล่างเพื่อลบการไล่ระดับสีออกจาก UIWebView:

[webView setBackgroundColor:[UIColor clearColor]];
[self hideGradientBackground:webView];


- (void) hideGradientBackground:(UIView*)theView
{
  for (UIView * subview in theView.subviews)
  {
    if ([subview isKindOfClass:[UIImageView class]])
      subview.hidden = YES;

    [self hideGradientBackground:subview];
  }
}

อย่าลืมเขียน webView.opaque = NO;
Nilesh Kikani

1
เอ่อเรากำลังพูดถึง "การไล่ระดับสี" อะไรที่นี่?
Greg Maletic

7

อัปเดตอย่างรวดเร็ว:

webView.opaque = true
webView.backgroundColor = UIColor.clearColor()

และอีกครั้งอย่าลืมตั้งค่า

<body style="background-color: transparent">

หรือยังดีกว่าแทนที่จะเป็นสไตล์อินไลน์ในสไตล์ชีตของคุณ:

body {
     background-color: transparent
}

1
ฉันไม่จำเป็นต้องกำหนดลักษณะร่างกาย แต่ฉันต้องตั้งค่าสีพื้นหลังและรหัสทึบแสง
Andrej


4

ใน XCode 6.x ยกเลิกทึบแสงและการเปลี่ยนแปลงความเป็นมาของความทึบแสงเพื่อ0% ฉันคิดว่า XCode เวอร์ชันอื่น ๆ ก็ใช้ได้เช่นกันใส่คำอธิบายภาพที่นี่


3

ฉันสามารถทำให้ UIWebView ของฉันโปร่งใสได้โดยไปที่ 'Attributes Inspector' และยกเลิกการเลือก Drawing Opaque

รหัส HTML ของฉันเพียงเพื่อการอ้างอิง

    UIWebView* webView =(UIWebView *) [cell viewWithTag:100];
    NSString* htmlContentString = [NSString stringWithFormat:
                                   @"<html>"
                                   "<style type='text/css'>html,body {margin: 0;padding: 0;width: 100%%;height: 100%%;}</style>"
                                   "<body>"
                                   "<table style='border:1px solid gray; border-radius: 5px; overflow: hidden;color:white;font-size:10pt' cellspacing=\"0\" cellpadding=\"1\" align='right'><tr>"
                                   "<td>Hello</td><td>There</td>"
                                   "</tr></table>"
                                   "</body></html>"
                                   ];
    [webView loadHTMLString:htmlContentString baseURL:nil];

0

หากต้องการลบการเลื่อนและทำให้UIWebViewโปร่งใสลองใช้รหัสนี้ด้านล่าง:

webView.opaque = NO;  
webView.backgroundColor = [UIColor clearColor];  

for(UIView *view in webView.subviews){   
     if ([view isKindOfClass:[UIImageView class]]) {  
          // to transparent   
          [view removeFromSuperview];  
     }  
     if ([view isKindOfClass:[UIScrollView class]]) {  
          UIScrollView *sView = (UIScrollView *)view;  
          //to hide Scroller bar 
          sView.showsVerticalScrollIndicator = NO;  
          sView.showsHorizontalScrollIndicator = NO;
          for (UIView* shadowView in [sView subviews]){  
               //to remove shadow  
               if ([shadowView isKindOfClass:[UIImageView class]]) {  
                    [shadowView setHidden:TRUE];  
               }  
          }  
     }   
}  

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.