title: Jetpack compose BlendMode.Xor different from preview
body: <p>I am testing a simple <code>Canvas</code> composable using <code>BlendMode.Xor</code> option. Below is my code :</p>
  <pre class="lang-kotlin prettyprint-override"><code>class MainActivity : ComponentActivity() {
      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          setContent {
              Surface(
                  modifier = Modifier
                      .fillMaxSize(),
              ) {
                  XORTest()
              }
          }
      }
  }
  
  @Composable
  @Preview
  fun XORTest() {
      Box(
          Modifier.background(Color.Blue)
      ) {
          Canvas(modifier = Modifier.fillMaxSize(), onDraw = {
              drawCircle(
                  color = Color.Black,
                  center = this.center,
                  radius = 100f,
                  alpha = 0.9f
              ) 
  
              drawCircle(
                  color = Color.Yellow,
                  radius = 50f,
                  center = this.center,
                  blendMode = BlendMode.Xor
              )
  
              drawCircle(
                  color = Color.White,
                  radius = 50f,
                  center = this.center + Offset(40f, 40f),
                  blendMode = BlendMode.Xor
              )
          })
      }
  }
  </code></pre>
  <p>This results in preview like this :</p>
  <p><img src="https://i.stack.imgur.com/xRy5l.png" width="300"></p>
  <p>However, when I run this preview on my emulator (in both dark/light mode) it results like this:</p>
  <p><img src="https://i.stack.imgur.com/Bq5Os.png" width="300"></p>
  <p>I don't understand what I am doing wrong here.</p>
  <p>I expect the preview &amp; the actual result to be same.</p>