Стиль CSS не применяется внутри TextView для <ul>и <ol>в iOS - PullRequest
Новая
       27

Стиль CSS не применяется внутри TextView для <ul>и <ol>в iOS

0 голосов
/ 14 мая 2018

Я показываю данные HTML внутри TextView, пространство для заполнения для <ul> или <ol> больше, чем требуется, но я не могу отрегулировать отступ / отступ с помощью CSS (я бы предпочел использовать CSS) со стороны HTML, Любое предложение, как этого добиться? 

<html>

<head>
  <style type="text/css">
    body {
      font-size: 14px;
      font-family: -apple-system, Arial, sans-serif;
      color: black;
      margin-bottom: 0px;
      padding-bottom: 0px;
      line-height: 20px;
    }
    
    ul,
    ol {
      padding-left: 10px;
    }
  </style>
</head>

<body>
  <p>Professionals are often vastly more comfortable solving analytical, convergent problems than those requiring more divergent thinking. In this article, Olivier Leclerc and Mihnea Moldoveanu share some strategies for stimulating truly novel thinking.
    They introduce five "flexons," which can be thought of as "languages" for shaping problems that help you bring diverse perspectives to problem solving:</p>

  <ul type="disc">
    <li>Networks</li>
    <li>Evolutionary</li>
  </ul>


  <ol>
    <li>Decision-agent</li>
    <li>System dynamics</li>
    <li>Information-processing :
      <ol>
        <li>Decision-agent</li>
        <li>System dynamics</li>
        <li>Information-processing</li>
      </ol>
    </li>
  </ol>


  <ul type="disc">
    <li>Networks :
      <ul>
        <li type="circle">Decision-agent</li>
        <li type="circle">System dynamics</li>
      </ul>
    </li>
  </ul>

</body>

</html>

Это HTML, ul,ol {padding-left:10px;} CSS не применяется.

Функция преобразования строки HTML в AttributeText 

 extension NSAttributedString {
    convenience public init?(styled: String, textAlignment: NSTextAlignment = .center, color: UIColor = .black) {
        guard let data = styled.data(using: String.Encoding.unicode) else {
            return nil
        }
        do {
            let string = try NSMutableAttributedString(data: data,
                                                       options: [NSAttributedString.DocumentReadingOptionKey.documentType: NSAttributedString.DocumentType.html], documentAttributes: nil)
            let paragraphStyle = NSMutableParagraphStyle()
            paragraphStyle.alignment = textAlignment

            string.addAttributes(
                [NSAttributedStringKey.foregroundColor: color],
                range: NSMakeRange(0, string.length)
            )

            self.init(attributedString: string.removingTrailingNewLine)
        } catch {
            return nil
        }
    }

    var removingTrailingNewLine: NSAttributedString {
        if string.hasSuffix("\n") {
            return attributedSubstring(from: NSRange(location:0, length: length - 1))
        }
        return self
    }
}

Изображение показывает, что отступы немного больше, чем должны быть, но не могут их отрегулировать. Image showing the end result

1 Ответ

0 голосов
/ 14 мая 2018

Уже есть вычисленные значения отступов и полей для ol и ul, и вы смотрите на это поле, поэтому измените поле слева до нуля или меньше исходного значения.

Проверьте этот код: 

  ul,
ol {
  border: 1px solid red; /* for display only*/
  margin-left: 0;
  padding-left: 50px;/* change this value and see how it works */
}
<p>Professionals are often vastly more comfortable solving analytical, convergent problems than those requiring more divergent thinking. In this article, Olivier Leclerc and Mihnea Moldoveanu share some strategies for stimulating truly novel thinking. They
  introduce five "flexons," which can be thought of as "languages" for shaping problems that help you bring diverse perspectives to problem solving:</p>

<ul type="disc">
  <li>Networks</li>
  <li>Evolutionary</li>
</ul>


<ol>
  <li>Decision-agent</li>
  <li>System dynamics</li>
  <li>Information-processing :
    <ol>
      <li>Decision-agent</li>
      <li>System dynamics</li>
      <li>Information-processing</li>
    </ol>
  </li>
</ol>


<ul type="disc">
  <li>Networks :
    <ul>
      <li type="circle">Decision-agent</li>
      <li type="circle">System dynamics</li>
    </ul>
  </li>
</ul>
...