Rich text image centre fix

[rt4914]

Explanation

@BenHenning had observed one issue in which if we open exploration, again and again quickly, then in some cases (approximately 10-20% times) the image in content card would cut from the very start. Check below image:

This has been fixed to keep image always in centre.

Also, to test this, you will need to open exploration again and again quickly as shown in gif. Make sure you test this atleast 10 times quickly.

Checklist

• The PR title starts with "Fix #bugnum: ", followed by a short, clear summary of the changes. (If this PR fixes part of an issue, prefix the title with "Fix part of #bugnum: ...".)
• The PR explanation includes the words "Fixes #bugnum: ..." (or "Fixes part of #bugnum" if the PR only partially fixes an issue).
• The PR follows the style guide.
• The PR does not contain any unnecessary auto-generated code from Android Studio.
• The PR is made from a branch that's not called "develop".
• The PR is made from a branch that is up-to-date with "develop".
• The PR's branch is based on "develop" and not on any other branch.
• The PR is assigned to an appropriate reviewer in both the Assignees and the Reviewers sections.

[veena14cs]

LGTM. This fixes image alignment thanks.

[BenHenning]

Not keen on this extension function because it has a high hidden cost, and potentially leaks a OnGlobalLayoutListener.

[BenHenning]

Also, please name this something closer to what it's doing, e.g. 'computeWidthOnGlobalLayout'

[rt4914]

Update the code like this:

private fun TextView.width(computeWidthOnGlobalLayout: (Int) -> Unit) {
    if (width == 0) {
      viewTreeObserver.addOnGlobalLayoutListener(object : ViewTreeObserver.OnGlobalLayoutListener {
        override fun onGlobalLayout() {
          viewTreeObserver.removeOnGlobalLayoutListener(this)
          computeWidthOnGlobalLayout(width)
        }
      })
    } else {
      computeWidthOnGlobalLayout(width)
    }
  }

@BenHenning does this look correct? If it is correct, then you can merge this directly.

[BenHenning]

Left a few comments--please address & verify the changes work before merging.

Thanks!

[BenHenning]

NB: because I'm unsure of the solution, I'm only merging this in the temp-integration-pt3 branch for now.

[BenHenning]

Also as I hoped, this does seem to fix the jankiness issues. Nice!

[nikitamarysolomanpvt]

LGTM

[BenHenning]

As mentioned in #494 I think we still have some image jankiness issues, and I wasn't confident a few weeks ago whether it was caused by the global layout listener introduced here. Can you investigate? It'd be good to better understand where that jankiness is coming from before we settle on this solution.

[rt4914]

As mentioned in #494 I think we still have some image jankiness issues, and I wasn't confident a few weeks ago whether it was caused by the global layout listener introduced here. Can you investigate? It'd be good to better understand where that jankiness is coming from before we settle on this solution.

I have checked this implementation mainly on HtmlParserTestActivity and I have observed that even with or without this solution the image does not have jankiness in HtmlParserTestActivity.

Also, with this solution, the image is actually rendering really well in exploration as compared to on develop. The issue is the image in HtmlParser is not janky otherwise it would have not been working correctly in HtmlParserTestActivity. After checking this again and again, I was able to confirm that the jankiness is in StateFragment somewhere. Now I need to investigate on that for exact reason behind the jankiness.

[rt4914]

As mentioned in #494 I think we still have some image jankiness issues, and I wasn't confident a few weeks ago whether it was caused by the global layout listener introduced here. Can you investigate? It'd be good to better understand where that jankiness is coming from before we settle on this solution.

I have checked this implementation mainly on HtmlParserTestActivity and I have observed that even with or without this solution the image does not have jankiness in HtmlParserTestActivity.

Also, with this solution, the image is actually rendering really well in exploration as compared to on develop. The issue is the image in HtmlParser is not janky otherwise it would have not been working correctly in HtmlParserTestActivity. After checking this again and again, I was able to confirm that the jankiness is in StateFragment somewhere. Now I need to investigate on that for exact reason behind the jankiness.

@BenHenning as discussed in meeting, the reason behind the jankiness is mainly because of state implementation. So what should we do here ?

[BenHenning]

Let's check this in as-is. We'll need to continue chipping away at the jankiness issue as part of #434.

[rt4914]

@BenHenning Merging this now with develop.