2
0

BackgroundBorder.cpp 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. /*
  2. * This source file is part of RmlUi, the HTML/CSS Interface Middleware
  3. *
  4. * For the latest information, see http://github.com/mikke89/RmlUi
  5. *
  6. * Copyright (c) 2008-2010 CodePoint Ltd, Shift Technology Ltd
  7. * Copyright (c) 2019-2023 The RmlUi Team, and contributors
  8. *
  9. * Permission is hereby granted, free of charge, to any person obtaining a copy
  10. * of this software and associated documentation files (the "Software"), to deal
  11. * in the Software without restriction, including without limitation the rights
  12. * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
  13. * copies of the Software, and to permit persons to whom the Software is
  14. * furnished to do so, subject to the following conditions:
  15. *
  16. * The above copyright notice and this permission notice shall be included in
  17. * all copies or substantial portions of the Software.
  18. *
  19. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  20. * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  21. * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  22. * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  23. * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
  24. * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
  25. * THE SOFTWARE.
  26. *
  27. */
  28. #include "../Common/TestsShell.h"
  29. #include <RmlUi/Core/Context.h>
  30. #include <RmlUi/Core/Element.h>
  31. #include <RmlUi/Core/ElementDocument.h>
  32. #include <RmlUi/Core/Types.h>
  33. #include <doctest.h>
  34. #include <nanobench.h>
  35. using namespace ankerl;
  36. using namespace Rml;
  37. TEST_CASE("background_border")
  38. {
  39. Context* context = TestsShell::GetContext();
  40. REQUIRE(context);
  41. static String document_rml = R"(
  42. <rml>
  43. <head>
  44. <link type="text/rcss" href="/../Tests/Data/style.rcss"/>
  45. <style>
  46. div > div {
  47. margin: 50px auto;
  48. width: 300px;
  49. height: 200px;
  50. background: #c3c3c3;
  51. border-color: #55f #f57 #55f #afa;
  52. }
  53. #no-radius > div {
  54. border-width: 8px 10px;
  55. }
  56. #small-radius > div {
  57. border-width: 40px 20px;
  58. border-radius: 5px;
  59. }
  60. #large-radius > div {
  61. border-width: 10px 5px 25px 20px;
  62. border-radius: 80px 30px;
  63. }
  64. </style>
  65. </head>
  66. <body>
  67. <div id="no-radius">
  68. <div/><div/><div/><div/><div/><div/><div/><div/><div/><div/>
  69. </div>
  70. <div id="small-radius">
  71. <div/><div/><div/><div/><div/><div/><div/><div/><div/><div/>
  72. </div>
  73. <div id="large-radius">
  74. <div/><div/><div/><div/><div/><div/><div/><div/><div/><div/>
  75. </div>
  76. </body>
  77. </rml>
  78. )";
  79. ElementDocument* document = context->LoadDocumentFromMemory(document_rml);
  80. REQUIRE(document);
  81. document->Show();
  82. const String msg = TestsShell::GetRenderStats();
  83. MESSAGE(msg);
  84. nanobench::Bench bench;
  85. bench.title("Backgrounds and borders");
  86. bench.relative(true);
  87. bench.minEpochIterations(100);
  88. bench.warmup(50);
  89. TestsShell::RenderLoop();
  90. bench.run("Reference (update + render)", [&] {
  91. context->Update();
  92. context->Render();
  93. });
  94. {
  95. ElementList elements;
  96. document->QuerySelectorAll(elements, "div > div");
  97. REQUIRE(!elements.empty());
  98. bench.run("Background all", [&] {
  99. // Force regeneration of backgrounds without changing layout
  100. for (auto& element : elements)
  101. element->SetProperty(Rml::PropertyId::BackgroundColor, Rml::Property(Colourb(), Unit::COLOUR));
  102. context->Update();
  103. context->Render();
  104. });
  105. bench.run("Border all", [&] {
  106. // Force regeneration of borders without changing layout
  107. for (auto& element : elements)
  108. element->SetProperty(Rml::PropertyId::BorderLeftColor, Rml::Property(Colourb(), Unit::COLOUR));
  109. context->Update();
  110. context->Render();
  111. });
  112. }
  113. for (const String id : {"no-radius", "small-radius", "large-radius"})
  114. {
  115. ElementList elements;
  116. document->QuerySelectorAll(elements, "#" + id + " > div");
  117. REQUIRE(!elements.empty());
  118. bench.run(("Border " + id).c_str(), [&] {
  119. for (auto& element : elements)
  120. element->SetProperty(Rml::PropertyId::BorderLeftColor, Rml::Property(Colourb(), Unit::COLOUR));
  121. context->Update();
  122. context->Render();
  123. });
  124. }
  125. document->Close();
  126. }
  127. TEST_CASE("box_shadow")
  128. {
  129. Context* context = TestsShell::GetContext();
  130. REQUIRE(context);
  131. static String document_rml = R"(
  132. <rml>
  133. <head>
  134. <link type="text/rcss" href="/../Tests/Data/style.rcss"/>
  135. <style>
  136. #boxshadow > div {
  137. width: 280dp;
  138. height: 70dp;
  139. border: 2dp #def6f7;
  140. margin: 10dp auto;
  141. padding: 15dp;
  142. border-radius: 30dp 8dp;
  143. box-sizing: border-box;
  144. margin-top: 100px;
  145. margin-bottom: 100px;
  146. }
  147. #boxshadow.blur > div {
  148. box-shadow:
  149. #f00f 40px 30px 25px 0px,
  150. #00ff -40px -30px 45px 0px,
  151. #0f08 -60px 70px 60px 0px,
  152. #333a 0px 0px 30px 15px inset;
  153. }
  154. </style>
  155. </head>
  156. <body>
  157. <div id="boxshadow" class="blur">
  158. <div/><div/><div/><div/><div/><div/><div/><div/><div/><div/>
  159. </div>
  160. </body>
  161. </rml>
  162. )";
  163. ElementDocument* document = context->LoadDocumentFromMemory(document_rml);
  164. REQUIRE(document);
  165. document->Show();
  166. nanobench::Bench bench;
  167. bench.title("Box-shadow");
  168. bench.relative(true);
  169. bench.warmup(5);
  170. TestsShell::RenderLoop(true);
  171. Element* element_boxshadow = document->GetElementById("boxshadow");
  172. ElementList elements;
  173. document->QuerySelectorAll(elements, "#boxshadow > div");
  174. REQUIRE(!elements.empty());
  175. bench.run("Reference (update + render)", [&] { TestsShell::RenderLoop(false); });
  176. element_boxshadow->SetClass("blur", true);
  177. bench.run("Box-shadow (repeated)", [&] {
  178. // Force regeneration of backgrounds without changing layout
  179. for (auto& element : elements)
  180. element->SetProperty(Rml::PropertyId::BackgroundColor, Rml::Property(Colourb(), Unit::COLOUR));
  181. TestsShell::RenderLoop(false);
  182. });
  183. unsigned int unique_id = 0;
  184. element_boxshadow->SetClass("blur", false);
  185. bench.run("Box-shadow (unique)", [&] {
  186. for (Element* element : elements)
  187. {
  188. unique_id += 1;
  189. String id_string = CreateString("%x", unique_id);
  190. REQUIRE(id_string.size() < 12);
  191. id_string.resize(12, 'f');
  192. const auto id_index_to_color = [&](int color_index) { return id_string.substr(color_index * 3, 3); };
  193. const String value =
  194. CreateString("#%sf 40px 30px 25px 0px, #%sf -40px -30px 0px 0px, #%s8 -60px 70px 0px 0px, #%sa 0px 0px 30px 15px inset",
  195. id_index_to_color(0).c_str(), id_index_to_color(1).c_str(), id_index_to_color(2).c_str(), id_index_to_color(3).c_str());
  196. element->SetProperty("box-shadow", value);
  197. }
  198. TestsShell::RenderLoop(false);
  199. });
  200. document->Close();
  201. }